<template>
  <div class="contain" v-loading="loading">
            <tz-breadcrumb  :pathArr='[{"name": "场景管理"},{"name": "餐厅管理", "url": "/home"}]'></tz-breadcrumb>
            <!-- 外部跳转 -->
            <!-- <button type="botton" @click="addRestaurant">新增餐厅跳转</button>
            <button type="botton" @click="restaurantInfo">餐厅信息管理跳转</button>
            <button type="botton" @click="restaurantDeskInfo">餐厅信息编辑</button>
            <button type="botton" @click="pay">支付弹窗</button> -->
            <div class="section-one-border">
              <!-- 头部tab  -->
              <el-row :gutter="10" class="section-one" style="margin-left:0px;margin-right:0px">
                <el-col :xs="20" :sm="20" :md="20" :lg="20" :xl="20" class="left">
                   <span v-if="restaurantListNoInfo" style="color:#999;font-size:14px;">点击右侧“添加餐厅”按钮即可添加餐厅</span>
                   <span v-for="(item,index) in restaurantList" :key="item.id" :class="[isActive == index? 'active':'']"  @click="selectRestaurant(item.id,index)">{{item.name}}</span>
                </el-col>
                <el-col :xs="4" :sm="4" :md="4" :lg="4" :xl="4"><div class="grid-content text-right add-btn" @click="addRestaurantNoparm"><i class="el-icon-plus"></i>新增餐厅</div></el-col>
              </el-row>
            </div>
            <!-- 餐厅信息 currentRIndex-->
            <div class="section-two">
              <div class="s-t-edit-border" @click="addRestaurant(restaurantInfoData.id,restaurantInfoData)">编辑<i class="el-icon-edit"></i></div>
              <div class="s-t-txt" >{{isOpen ? '收起':'展开'}}</div>
              <el-collapse v-model="activeNames" @change="handleChange" >
                <el-collapse-item title="餐厅信息" name="1" >
                  <div  >
                  <!-- 内容为空的时候出现的内容 -->
                  <div class="text-center no-r-info" v-if="restaurantListNoInfo">
                     <img src="./../../public/img/no-info.png" />
                     <p>空空如也，您还没有添加餐厅，点击右上方“新增餐厅”按钮即可添加餐厅信息</p>
                  </div>
                  <!-- 内容不为空出现的内容 -->
                 
                  <div v-if="restaurantInfoData  != ''">
                    <el-row :gutter="10" class="s-t-main" style="margin-left:0px;margin-right:0px">
                      <el-col :xs="24" :sm="10" :md="10" :lg="6" >
                        <div class="s-t-info">
                          <div class="left">
                            <img v-bind:src="imgUrl + restaurantInfoData.ewm_logo" class="s-t-head-img"/>
                          </div>
                          <div class="right">
                            <h4>{{restaurantInfoData.name}}</h4>
                            <p>{{restaurantInfoData.floor}}F<span style="margin-left:10px;">{{restaurantInfoData.address}}</span></p>
                            <p>公告：{{restaurantInfoData .notice}}</p>
                          </div>
                        </div>
                      </el-col>
                      <el-col :xs="24" :sm="14" :md="14" :lg="18"  class="introduce">
                        {{restaurantInfoData.introduction}}
                      </el-col>
                      
                    </el-row>
                    <div class="s-t-img-show"  >
                       <img  v-for="itemImg in restaurantInfoImg" :key="itemImg" v-bind:src="imgUrl + itemImg"/>
                      <!-- <div v-for="(itemImg,indexImg) in restaurantInfoData.img" :key="indexImg">
                        <img   v-bind:src="imgUrl + itemImg"/>
                      </div> -->
                      
                    </div>
                    <!-- 餐品信息及管理按钮 -->
                    <div class="s-t-btn-border text-center">
                      <el-button type="warning" plain @click="restaurantInfo(restaurantInfoData.id)">餐品信息及管理</el-button>
                      <el-button type="warning" plain @click="deskCode(restaurantInfoData.id)">餐桌二维码管理</el-button>
                       <el-button type="warning" plain @click="orderManage(restaurantInfoData.id)">订单管理</el-button>
                      
                    </div>
                  </div>
                  </div>
                </el-collapse-item>
              </el-collapse>
            </div>
            <!-- 送餐信息和餐厅信息 -->
            <div class="section-three" >
              <div>
                <!-- 预约及送餐信息 -->
                
                <!-- 餐桌信息及状态 -->
                <div class="s-three-two" :class="[sendOpenb == 2? 's-three-two-big':'' || rList == ''? 'change-height':'']">
                   
                   <div class="s-t-center-border" :class="[rList == ''? 'change-height':'' ]">
                    <div class="s-t-center-head">
                      <div class="left">
                        <span class="title">餐桌信息及状态</span><span class="edit-desk"  @click="addRestaurantDesk(restaurantInfoData.id)">编辑<i class="el-icon-edit"></i></span>
                      </div>
                      <div class="right" v-if ="rList != ''">
                        <!-- <select>
                          <option value ="volvo">2019.04.01 11:00～14:00</option>
                          <option value ="saab">2019.04.01 14:00～16:00</option>
                          <option value="opel">2019.04.01 16:00～18:00</option>
                          <option value="audi">2019.04.01 18:00～21:00</option>
                        </select> -->
                      </div>
                    </div>
                    <!-- 为空显示的内容 -->
                   <div class="no-c-tip" v-if ="rListNoInfo">您还没有添加餐厅，点击右上方“新增餐厅”按钮即可添加餐厅信息</div>
                    <!-- 不为空显示的内容 -->
                    <div class="s-t-center-main" v-if ="rList != ''">
                      <!-- 左侧分类 -->
                      <div class="left">
                        <div class="left-menu" v-for="(item,index) in rList" :key="item.id"  :class="[areaClassActiveIndex == index? 'active':'']" @click="areaClassClick(index)">{{item.title}}</div>
                      </div>
                      <!-- 右侧列表 -->
                      <div class="right">
                        <div class="desk-list-main-border">
                           <div class="desk-list-main text-center"   v-for='item in rList[areaClassActiveIndex].goods' :key="item.desk_number" :class="[item.status == 0?'':item.status == 2?'bg-orange':item.status == 1?'bg-yellow':'bg-blue']" @click="deskStatusClick(item.desk_number,rList[areaClassActiveIndex].goods)">
                              <h4>{{item.desk_number}}</h4>
                              <p>{{item.people}}人桌</p>
                              <h3 class="desk-status">{{item.status == 0?'空闲':item.status == 2?'有客':item.status == 1?'下单中':'已预订'}}</h3>
                              <!-- 遮罩 -->
                              <div class="desk-list-main-master" v-show="currentdeskNum == item.desk_number">
                                <div class="currenOption">当前操作</div>
                              </div>
                           </div>
                        </div>
                      </div>
                    </div>
                   </div>
                </div>
                <div class="s-three-three" :class="[rList == ''? 'change-height':'' ]">
                  <div class="s-t-center-border" :class="[rList == ''? 'change-height':'' ]">
                    <div class="s-t-center-head" >
                      <div class="left">
                        <span class="title">餐桌信息</span>
                      </div>
                    </div>
                    <!-- 没有数据情况下 -->
                    <!-- 为空显示的内容 -->
                   <div class="no-c-tip" v-if ="rListNoInfo">您还没有添加餐厅，点击右上方“新增餐厅”按钮即可添加餐厅信息</div>
                    <!-- 有数据的情况下 -->
                    <!-- 内容 -->
                    <div class="s-t-three-main" v-if ="rList != ''">
                      <div class="text-center desk-no-click" v-if='!isClick'>请点击左侧桌号查看餐桌信息</div>
                      <div class="desk-info-detail" v-if='isClick'>
                        <div class="desk-info-detail-main">
                          <span>餐桌：</span> {{currentdeskNum}}
                          <!-- peopleVal != '' -->
                          <div class="d-i-d-nub text-right" v-if ="placeOrderMain == 2 && SList != ''"><span>人数：</span><span class="nub" >{{SList[0].num}}</span></div>
                        </div>
                        <div class="desk-info-detail-main">
                          <span>状态：</span> 
                          {{currentDeskStatus == 0?'空闲':currentDeskStatus == 2?'有客':currentDeskStatus == 1?'下单中':'已预订'}}

                          <!-- <a v-if="currentDeskStatus!=2" @click="modifyStatusClick(currentdeskNum,currentDeskStatus)">修改状态</a> -->
                        </div>
                        <!-- 第一部分出现的按钮 -->
                        <el-row :gutter="20" v-if ="placeOrderMain == 0">
                          <!-- <el-col :span="12"><div class=""><el-button type="warning" plain disabled>预订</el-button></div></el-col> -->
                          <el-col :span="24" class="f-option-btn"><div ><el-button type="warning" plain @click="placeOrderClick">下单</el-button></div></el-col>
                        </el-row>
                        <!-- 下单中 -->
                        <div v-if ="placeOrderMain == 1">
                          <div class="box" >
                            <el-form  label-width="40px" class="form-border">
                              <el-form-item label="人数">
                                <el-input v-model="peopleVal" type="number" placeholder="请输入人数" :disabled="writePeopleVal"></el-input>
                              </el-form-item>
                              <el-form-item label="备注">
                                <el-input v-model="remark" type="txt" placeholder="请输入备注信息"></el-input>
                              </el-form-item>
                            </el-form>
                          </div>
                          <div class="select-menu">
                            <div class="select-menu-title" >
                              选择菜品
                            </div>
                            <div class="select-menu-main">
                              <div class="left text-center">
                                <div class="leftline" v-for="(item,index) in mList" :key="item.id" :class="[mListClassActive == index? 'active-menu':'']" @click="mListClassClick(index)">{{item.title}}
                                  <div class="category-nums" v-if='item.num > 0'>    {{item.num <= 0 ? 0 : item.num}}         
                                  </div>
                                </div>
                              </div>
                              <div class="right">
                                <div class="menu-list" v-for='item in mList[mListClassActive].goods' :key="item.id">
                                    <div class="menu-list-left"><img :src="imgUrl + item.goods_img" /></div>
                                    <div class="menu-list-center">
                                      <div class="goods-name">{{item.goods_name}} </div>
                                      <div class="price">¥{{item.price}} </div>
                                    </div>
                                    <div class="menu-list-right">
                                      <i class="el-icon-remove-outline" v-if="item.num > 0 " @click="deleted(item.id,item.cid,item.price)"></i>
                                      <span v-if="item.num > 0 ">{{item.num = 0 ? 0 : item.num}}</span>
                                      <i class="el-icon-circle-plus" @click="add(item.id,item.cid,item.price)"></i></div>
                                </div>
                              </div>
                            </div>
                            <div class="select-menu-title text-right select-menu-title-count" >
                              已点<span class="numPrice">{{goodsNums <=0 ? 0 : goodsNums}}</span>份 <span class="distance">共¥</span><span class="numPrice">{{price.toFixed(2)}}</span>
                            </div>
                          </div>
                          <!-- <el-row :gutter="20"  class="box-btn"> -->
                          <div class="box-btn text-center">
                            <el-button type="warning" plain @click="cancelPlaceOrder">取消</el-button>
                            <el-button type="warning" plain @click="surePlaceOrder()">{{changeOrder==1?'确认并改单':'确认并下单'}}</el-button>
                          </div>
                            <!-- <el-col :span="12" class="f-option-btn"><div ></div></el-col>
                            <el-col :span="12" class="f-option-btn"><div ></div></el-col>
                          </el-row> -->
                        </div>
                        <!-- 有客 -->
                        <div class="hasGuest" v-if ="placeOrderMain == 2">
                          <div class="hasGuestList" >
                              <!-- <div  v-show='SList == ""'>
                                <div class="title">服务员下单</div>
                                <div  class="s-list-title" >----暂无服务员下单菜单----</div>
                             </div> -->
                             <div v-for="(item,index) in SList" :key="item.id">
                               <div class="title">服务员下单{{index+1}}</div>
                              <div class="s-list" v-for="(itema,index2) in item.goods_list " :key="index2">
                                <!-- <div class="s-list-title">菜单{{itema.type}}</div> -->
                                <div class="s-list-content"  >

                                    <div  class="" >
                                      <ul  :class="[openMenuDetailStatus[index][index2] == 1  ? 'menu-open':'menu-colse']">
                                        <li v-for="(itemb,index3) in itema.type_goods_list" :key="index3">{{itemb.goods_name}} <span >x{{itemb.number}}</span><span v-if="openMenuDetailStatus[index][index2] == 0  ">等</span></li>
                                        <!-- <li>麻婆豆腐 <span v-if="openMenuDetailStatus1">x2</span><span v-if="!openMenuDetailStatus1">等</span></li> -->
                                      </ul>
                                      <div class="s-list-count">已点<span class="numPrice">{{itema.allnum}}</span>份<span class="distance">共¥</span><span class="numPrice">{{itema.allprice.toFixed(2)}}</span></div>
                                    </div>
                                    <!-- 底部操作 -->
                                    <div class="btn-options">
                                      <div class="left">
                                        <!-- 备注：无 -->
                                        </div>
                                      <div class="right text-right" v-if ="openMenuDetailStatus[index][index2] == 1  " @click="openMenuDetail(index,index2,'s')">
                                        <span>收起菜单详情<i class="el-icon-arrow-up"></i></span>
                                      </div>
                                      <div class="right text-right" v-if="openMenuDetailStatus[index][index2] == 0" @click="openMenuDetailOpen(index,index2,'s')" >
                                        <span>展开菜单详情<i class="el-icon-arrow-down"></i></span>
                                      </div>
                                    </div>
    
                                  </div>
                                  <div class="s-list-title-remark">备注:{{item.remark=='' || item.remark==null?'暂无备注':item.remark}}</div>
                              </div>
                             </div>
                             <!-- <div  v-show='CList == ""'>
                              <div class="title">扫码下单</div>
                              <div  class="s-list-title" >----暂无扫码下单菜单----</div>
                             </div> -->
                             <div v-for="(item,index) in CList" :key="item.id" >
                               <div class="title">客人下单</div>
                               
                                <div class="s-list" v-for="(itema,index2) in item.goods_list " :key="index2" >
                                    <div class="s-list-title">菜单{{itema.type}}</div>
                                    <div class="s-list-content"  >
                                      <div  class="" >
                                        <ul  :class="[openMenuDetailStatus1[index][index2] == 1 ? 'menu-open':'menu-colse']">
                                          <li v-for="(itemb,index3) in itema.type_goods_list" :key="index3">{{itemb.goods_name}} <span >x{{itemb.number}}</span><span v-if="openMenuDetailStatus1[index][index2] == 0 ">等</span></li>
                                          <!-- <li>麻婆豆腐 <span v-if="openMenuDetailStatus1">x2</span><span v-if="!openMenuDetailStatus1">等</span></li> -->
                                        </ul>
                                        <div class="s-list-count">已点<span class="numPrice">{{itema.allnum}}</span>份<span class="distance">共¥</span><span class="numPrice">{{itema.allprice.toFixed(2)}}</span></div>
                                      </div>
                                      <!-- 底部操作 -->
                                      <div class="btn-options">
                                        <div class="left">
                                          <!-- 备注：无 -->
                                          </div>
                                        <div class="right text-right" v-show ="openMenuDetailStatus1[index][index2] == 1 " @click="openMenuDetail(index,index2,'c')">
                                          <span>收起菜单详情<i class="el-icon-arrow-up"></i></span>
                                        </div>
                                        <div class="right text-right" v-show="openMenuDetailStatus1[index][index2] == 0  " @click="openMenuDetailOpen(index,index2,'c')" >
                                          <span>展开菜单详情<i class="el-icon-arrow-down"></i></span>
                                        </div>
                                      </div>
      
                                    </div>
                                    <div class="s-list-title-remark">备注:{{item.remark=='' || item.remark==null?'暂无备注':item.remark}}</div>
                                </div>
                              
                             </div>
                             
                          </div>
                          
                        </div>
                        <!-- 底部操作按钮 -->
                          <div class="hasGuest-btn" v-if ="placeOrderMain == 2">
                            <div ><span class="common-orange-btn " @click="placeOrderAgain">下单</span></div>
                            <div ><span class="common-orange-btn " @click="logMenuChangeClick(0)">改单</span></div >
                            <div ><span class="common-orange-btn " @click="changeDesk(currentdeskNum)">换桌</span></div >
                            <div ><span class="common-orange-btn " @click="logMenuChangeClick(1)">打印</span></div >
                            <div ><span class="common-orange-btn " @click="settleAccounts">结账</span></div >
                          </div>
                        
                      </div>
                      
                      
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <!-- 修改状态弹框 -->
            <el-dialog title="修改状态" :visible.sync="modifyStatus">
              <el-form>
                <div class="desk-info-detail-main"><span>餐桌：</span> {{currentdeskNum}}</div>
                <el-form-item label="状态" >
                  <el-select v-model="mStatus" placeholder="请修改状态">
                    <el-option
                      v-for="item in mStatusOption"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value">
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-form>
              <div slot="footer" class="dialog-footer">
                <el-button @click="modifyStatus = false">取 消</el-button>
                <el-button type="primary" @click="modifyStatus = false">确 定</el-button>
              </div>
            </el-dialog>
           
            <!-- 换桌弹框 -->
            <el-dialog title="请选择更换后的目标桌号" :visible.sync="changeDeskModel" :before-close="handleCloseChangeDesk" class="model-border">
              <div class="model-line"></div>
              <div class="s-t-center-main s-t-center-main-model" v-if ="rList != ''">
                <!-- 左侧分类 -->
                <div class="left leftModel" >
                  <div class="left-menu" v-for="(item,index) in rList" :key="item.id"  :class="[areaClassActiveIndex == index? 'activeModel':'']" @click="areaClassClick(index)">{{item.title}}</div>
                </div>
                <!-- 右侧列表 -->
                <div class="right rightModel">
                  <div class="desk-list-main-border">
                      <div class="desk-list-main text-center"   v-for='item in rList[areaClassActiveIndex].goods' :key="item.desk_number" :class="[item.status == 0?'':item.status == 2?'bg-orange':item.status == 1?'bg-yellow':'bg-blue']" @click="deskStatusClickModel(item.desk_number,rList[areaClassActiveIndex].goods)">
                        <h4>{{item.desk_number}}</h4>
                        <p>{{item.people}}人桌</p>
                        <h3 class="desk-status">{{item.status == 0?'空闲':item.status == 2?'有客':item.status == 1?'下单中':'已预订'}}</h3>
                        <!-- 遮罩 -->
                        <!-- <div class="desk-list-main-master" v-show="currentdeskNum == item.desk_number">
                          <div class="currenOption">当前操作</div>
                        </div> -->
                        <!-- 桌号选中事件的图片 -->
                        <div class="select-checked-icon hide" :class="[deskBeSelect == true && item.desk_number == currentdeskNum ? 'show':'hide']"><img src="./../../public/img/ic_checkyellow.png" /></div>
                      </div>
                  </div>
                </div>
              </div>
              <div slot="footer" class="dialog-footer text-center">
                <!-- <el-button @click="cancelChangeDesk">取 消</el-button> -->
                <!-- <el-button type="primary " >确 定</el-button> -->
                <el-button type="warning" class="a-common-orange sure-big-btn" plain @click="sureChangeDesk">确 定</el-button>
              </div>
            </el-dialog>
            <!-- 打印和改单的弹框 -->
            <el-dialog title="" :visible.sync="logMenuClick" :before-close="closeLogMenu" class="model-border">
              <div class="model-title-change">{{modelTitle}}</div>
              <div class="model-line"></div>
                  <!-- 打印列表 -->
                <div class="model-menu-list-all-border" >
                  
                  <!-- 服务员下单 -->
                  <div class="model-menu-list model-menu-list-m-b" >
                    <!-- 打印复选事件 -->
                    <el-checkbox-group class="model-menu-list-m-b-all" v-model="checkList"  @change="handleCheckedAll" v-if="showMergeBtn">
                      <div v-for="(item,index) in SList" :key="item.id" >
                        <div class="first-title"><el-checkbox :label="item.order_code" >服务员下单{{index+1}}</el-checkbox></div>
                        <el-checkbox-group v-model="checkListServer"  @change="handleCheckedLeft" >
                          <div class="model-menu-list-s" v-for="(itema,index2) in item.goods_list" :key="index2">
                            <div >
                            <!-- 左侧服务员下单菜单 -->
                              <div class="model-menu-list-border"  :key="index2">
                                <div class="model-menu-list-main">
                                  <!-- 列表循环begin -->
                                  <div >
                                  <div class="model-menu-list-content" >
                                      <!-- <div class="check-box"><el-checkbox label="" >服务员下单{{index+1}}</el-checkbox></div> -->
                                        <div class="model-menu-list-content-li"  v-for="(itemb,index3) in itema.type_goods_list" :key="index3">
                                            <div class="left">{{itemb.goods_name}}</div>
                                            <div class="right text-right">x{{itemb.number}}</div>
                                        </div>
                                  </div>
                                  </div>
                                </div>
                                <!-- 列表底部统计 -->
                                <div class="model-menu-list-count text-right" v-for="(item,index) in SList" :key="item.id">
                                  已点<span class="numPrice">
                                    {{itema.allnum}}
                                    </span>份
                                    <span class="distance">共¥</span><span class="numPrice">
                                      {{itema.allprice}}
                                      </span>
                                </div>
                              </div>
                            </div>
                          </div>
                        </el-checkbox-group>
                      </div>
                      <div v-for="(item,index) in CList" :key="item.id" >
                        <div class="first-title"><el-checkbox :label="item.order_code" >客人下单</el-checkbox></div>
                        <el-checkbox-group v-model="checkListServer"  @change="handleCheckedLeft">
                          <div class="model-menu-list-s" >
                            <div >
                            <!-- 左侧服务员下单菜单 -->
                              <div class="model-menu-list-border">
                                <div class="model-menu-list-main">
                                  <!-- 列表循环begin -->
                                  <div class="model-menu-list-content"  v-for="(itema,index2) in item.goods_list" :key="index2">
                                      <div class="check-box"><el-checkbox :label="item.order_code+','+(index2+1)" >菜单{{index2+1}}</el-checkbox></div>
                                        <div class="model-menu-list-content-li"  v-for="(itemb,index3) in itema.type_goods_list" :key="index3">
                                            <div class="left">{{itemb.goods_name}}</div>
                                            <div class="right text-right">x{{itemb.number}}</div>
                                        </div>
                                  </div>
                                </div>
                                <!-- 列表底部统计 -->
                                <div class="model-menu-list-count text-right">
                                  已点<span class="numPrice">
                                    {{CList[0].allnums}}
                                  </span>份 <span class="distance">共¥</span><span class="numPrice">
                                    {{CList[0].allprices.toFixed(2)}}
                                    </span>
                                </div>
                              </div>
                            </div>
                          </div>
                        </el-checkbox-group>
                      </div>
                    </el-checkbox-group>
                    <!-- 改单单选事件 -->
                    <el-checkbox-group 
    :max="1" class="model-menu-list-m-b-all" v-model="checkListChange"  @change="handleCheckedAllChange" v-if="!showMergeBtn">
                      <div v-for="(item,index) in SList" :key="item.id" >
                        <div class="first-title"><el-checkbox :label="item.order_code" >服务员下单{{index+1}}</el-checkbox></div>
                        <!-- <el-checkbox-group v-model="checkListServer"  @change="handleCheckedRight" > -->
                          <div class="model-menu-list-s" v-for="(itema,index2) in item.goods_list" :key="index2">
                            <div >
                            <!-- 左侧服务员下单菜单 -->
                              <div class="model-menu-list-border"  :key="index2">
                                <div class="model-menu-list-main">
                                  <!-- 列表循环begin -->
                                  <div >
                                  <div class="model-menu-list-content" >
                                      <!-- <div class="check-box"><el-checkbox label="" >服务员下单{{index+1}}</el-checkbox></div> -->
                                        <div class="model-menu-list-content-li"  v-for="(itemb,index3) in itema.type_goods_list" :key="index3">
                                            <div class="left">{{itemb.goods_name}}</div>
                                            <div class="right text-right">x{{itemb.number}}</div>
                                        </div>
                                  </div>
                                  </div>
                                </div>
                                <!-- 列表底部统计 -->
                                <div class="model-menu-list-count text-right" v-for="(item,index) in SList" :key="item.id">
                                  已点<span class="numPrice">
                                    {{itema.allnum}}
                                    </span>份
                                    <span class="distance">共¥</span><span class="numPrice">
                                      {{itema.allprice.toFixed(2)}}
                                      </span>
                                </div>
                              </div>
                            </div>
                          </div>
                        <!-- </el-checkbox-group> -->
                      </div>
                      <div v-for="(item,index) in CList" :key="item.id" >
                        <div class="first-title"><el-checkbox :label="item.order_code" >客人下单</el-checkbox></div>
                        <!-- <el-checkbox-group v-model="checkListServer"  @change="handleCheckedLeft"> -->
                          <div class="model-menu-list-s" >
                            <div >
                            <!-- 左侧服务员下单菜单 -->
                              <div class="model-menu-list-border">
                                <div class="model-menu-list-main">
                                  <!-- 列表循环begin -->
                                  <div class="model-menu-list-content"  v-for="(itema,index2) in item.goods_list" :key="index2">
                                      <!-- <div class="check-box"><el-checkbox :label="item.order_code+','+(index2+1)" >菜单{{index2+1}}</el-checkbox></div> -->
                                        <div class="model-menu-list-content-li"  v-for="(itemb,index3) in itema.type_goods_list" :key="index3">
                                            <div class="left">{{itemb.goods_name}}</div>
                                            <div class="right text-right">x{{itemb.number}}</div>
                                        </div>
                                  </div>
                                </div>
                                <!-- 列表底部统计 -->
                                <div class="model-menu-list-count text-right">
                                  已点<span class="numPrice">
                                    {{CList[0].allnums}}
                                  </span>份 <span class="distance">共¥</span><span class="numPrice">
                                    {{CList[0].allprices.toFixed(2)}}
                                    </span>
                                </div>
                              </div>
                            </div>
                          </div>
                        <!-- </el-checkbox-group> -->
                      </div>
                    </el-checkbox-group>

                  </div>
                </div>
                 
              <div slot="footer" class="dialog-footer text-center">
                <el-button type="warning" class="a-common-orange sure-big-btn" plain @click="surelogMenuClick(modelTitle)">确 定</el-button>
                <!-- <el-button type="warning" class="a-common-orange sure-big-btn" plain @click="logMenuClickMerge" v-if="showMergeBtn">合并打印</el-button> -->
              </div>
            </el-dialog>
            <!-- 结账弹框 -->
            <el-dialog  top="14px"    custom-class="dialog-show" :visible.sync="settleAccountsModel" >
              <div class="model-title-change">{{acountTitle}}</div>
              <div style='display:flex;'>
                <!-- 左侧区域 -->
                <div class="pay-area" style="background-color:#fff;">
                    <div class="pay-area-table">
                    <table class='pay-tb'>
                        <thead>
                            <tr>
                                <th>订单号</th>
                                <th>菜单名</th>
                                <th>菜品</th>
                                <th>菜品数</th>
                                <th>付款状态</th>
                                <th>金额</th>
                            </tr>
                        </thead>
                        <tbody class="order-table-main" >
                            <!-- 服务员下单 -->
                            <tr v-for="(item,index) in SList" :key="item.id">
                                <td>{{item.order_code}}</td>
                                <td v-for="(itema,index2) in item.goods_list" :key="index2">服务员下单{{index+1}}</td>
                                <td >{{item.goods_list[0].type_goods_list[0].goods_name}}等</td>
                                <td  v-for="(itema,index2) in item.goods_list" :key="index2">{{itema.allnum}}份</td>
                                <td>{{item.status_desc}}</td>
                                <td  v-for="(itema,index2) in item.goods_list" :key="index2">￥{{itema.allprice.toFixed(2)}}</td>
                            </tr> 
                            <!-- 扫码下单 -->
                            <tr v-for="(item,index) in CList" :key="item.id">
                                <td>{{item.order_code}}</td>
                                <td >客人下单</td>
                                <td >{{item.goods_list[0].type_goods_list[0].goods_name}}等</td>
                                <td>{{item.allnums}}份</td>
                                <td>{{item.status_desc}}</td>
                                <td>￥{{item.total_price}}</td>
                            </tr>    
                        </tbody>
                    </table>
                    </div>
                    <!-- 中间付款金额 -->
                    <div class="pay-momeny">
                        <div>总计应付<span>￥
                          {{settleAccountsAllPrice.total_pay != ""?settleAccountsAllPrice.total_pay:'0'}}
                          </span></div>
                        <div>已付<span>￥
                          {{settleAccountsAllPrice.paid != ""?settleAccountsAllPrice.paid:'0'}}
                          </span></div>
                        <div>本次需支付<span>￥{{settleAccountsAllPrice.need_pay}}</span></div>
                        <div class="pay-update" @click="payUpdate">需要修改订单？请点击修改</div>
                    </div>
                    <!-- 选择支付方式 -->
                    <div class="pay-select">
                        <div class="pay-sel-product">{{payStatus==1?'选择支付方式':'请选择退款方式'}}</div>
                        <el-radio-group v-model="payWayRadio" v-if="payStatus==1">
                            <el-radio :label="1">银行卡支付</el-radio>
                            <el-radio :label="2">支付宝支付</el-radio>
                            <el-radio :label="3">微信支付</el-radio>
                            <el-radio :label="4">现金支付</el-radio>
                        </el-radio-group>
                        <el-radio-group v-model="refundWayRadio" v-else>
                            <el-radio :label="2">支付宝原路退款</el-radio>
                            <el-radio :label="4">线下退款</el-radio>
                        </el-radio-group>
                        <!-- 输入金额 -->
                        <div class="pay-how-much">
                            <span>输入金额</span>
                            <el-input v-model="payMoney"   type="number" placeholder="请输入数字"></el-input>
                            

                        </div>
                        <div v-show="payMoneyShow" class="warn">*数字为整数或者带两位小数</div>
                        <div class="pay-how-much">
                            <span>备注</span>
                            <el-input v-model="payRemark"  placeholder="请输入备注信息"></el-input>
                        </div>
                        <!-- 确定 -->
                        <div class="pay-sure-btn">
                            <!-- 留一块空白区域，固定按钮的位置 -->
                            <span></span>
                            <span class="paySureBtn" @click="paySureOption">确定</span>
                        </div>
                    </div>
                    <!-- 付款信息 -->
                    <div class="pay-msg">付款信息</div>
                    <div class="pay-msg-border">
                    <div  class="s-list-title" v-show='payRecordList == ""'>----暂无支付/退款记录----</div>
                    <table class='pay-tb' v-show="payRecordList !=''">
                        <thead>
                            <tr>
                                <th>支付订单号</th>
                                <th>付款时间</th>
                                <th>支付方式</th>
                                <th>支付账户</th>
                                <th>备注</th>
                                <th>付款金额/退款金额</th>
                            </tr>
                        </thead>
                        
                        <tbody>
                            <tr v-for ="item in payRecordList" :key="item.id">
                                <td>{{item.order_code == null || item.order_code == ''?'/':item.order_code}}</td>
                                <td>{{getLocalTime(item.time)}}</td>
                                <td v-if="payStatus==1">{{item.pay_status==2?'支付宝支付':item.pay_status==1?'银行卡支付':item.pay_status==3?'微信支付':'现金'}}</td>
                                <td v-if="payStatus==2">{{item.refund_status==2?'支付宝原路退款':'线下退款'}}</td>
                                <td>/</td>
                                <td>{{item.remark == null || item.remark == ''?'/':item.remark}}</td>
                                <td><span v-if="item.type ==1">-</span>{{item.price}}</td>
                            </tr>
                            
                        </tbody>
                    </table>
                    </div>
                    <!-- 总计付款 -->
                    <div class="pay-total">总计付款  <span>￥{{Math.floor(payRecordAllPrice * 100) / 100}}</span>  </div>
                    <!-- 确认结账完毕 -->
                    <div class="pay-is-success">
                        <p @click="confirmSettlement">确认结账完毕</p>
                    </div>
                </div>
                <!-- 右侧 -->
                <div v-if="payRightArea" class="pay-right-area" >
                    <!-- 订单1 -->
                    <div class="pay-dish-list-all">
                      <!-- <div  class="s-list-title text-center" v-show='SList == ""'>----暂无服务员下单菜单----</div> -->
                      <div class="pay-dish-list" v-for="(item,index) in SList" :key="item.id">
                          <div class="title"><h3>服务员下单{{index+1}}</h3></div>
                          <div class="pay-node">{{item.order_code}}</div>
                          <div v-for="(itema,index2) in item.goods_list" :key="index2">
                            <!-- 商品1 -->
                            <div class="pay-dish" v-for="(itemb,index3) in itema.type_goods_list" :key="index3">
                                <div class="pay-dish-name">{{itemb.goods_name}}</div>
                                <div class="menu-list-right">
                                    <i class="el-icon-remove-outline" v-if="item.status == 1" @click="deletedMenu(item.id,itema.type,itemb.id,1)" ></i>
                                    <span >{{itemb.number}}</span>
                                    <i class="el-icon-circle-plus" v-if="item.status == 1" @click="addMenu(item.id,itema.type,itemb.id,1)"></i>
                                </div>
                            </div>
                          </div>
                      </div>
                      <!-- 扫码下单 -->
                      <div class="title custom-title" v-show='CList != ""'><h3>客人下单</h3></div>
                      <!-- <div  class="s-list-title text-center" v-show='CList == ""'>----暂无扫码下单菜单----</div> -->
                      <div class="pay-dish-list" v-for="(item,index) in CList" :key="item.id">
                          <div class="pay-node">{{item.order_code}}</div>
                         
                          <div v-for="(itema,index2) in item.goods_list" :key="index2" class="scan-menu-all-border">
                            <!-- 商品1 -->
                            <div class="scan-menu-title-second">菜单{{index2+1}}:</div>
                            <div class="pay-dish" v-for="(itemb,index3) in itema.type_goods_list" :key="index3">
                                <!--  -->
                                
                                <div class="pay-dish-name">{{itemb.goods_name}}</div>
                                <div class="menu-list-right">
                                    <i class="el-icon-remove-outline" v-if="item.status == 1"  @click="deletedMenu(item.id,itema.type,itemb.id,2)" ></i>
                                    <span >{{itemb.number}}</span>
                                    <i class="el-icon-circle-plus" v-if="item.status == 1"  @click="addMenu(item.id,itema.type,itemb.id,2)"></i>
                                </div>
                            </div>
                          </div>
                          
                      </div>
                    </div>
                    <!-- 原始总金额以及按钮 -->
                    <div class="pay-total-all">
                        <!-- 上按钮 -->
                        <div class="pay-all">
                            <div class="text-right">
                                <span>原始总金额</span> <span>￥{{settleAccountsAllPrice.total_pay}}</span>
                            </div> 
                            <div class="text-right" >
                                <span>修改后金额</span> <span v-if="!countIsClickOption">无</span><span class="pay-update-status" v-if="countIsClickOption">
                                  
                                  <!-- {{EditPrice==0? settleAccountsAllPrice.total_pay:EditPrice}} -->
                                  {{EditPrice==0? '0':EditPrice.toFixed(2)}}
                                  </span>
                            </div>  
                        </div>
                        <!-- 下按钮 -->
                        <div class="dialog-btn-area">
                            <div class="dialog-btn-delete dialog-make-sure" @click="cancelPayRight">取消</div>
                            <div class="dialog-btn-sure dialog-make-sure" @click="payChangeStatus">确 定</div>
                        </div>
                    </div>
                </div>
              </div>
            </el-dialog>
            <!-- 弹框 -->
            <el-dialog
              title="错误提示"
              :close-on-click-modal = 'false'
              :show-close = 'false'
              :visible.sync="centerDialogVisible"
              width="30%"
              center>
              <p class="text-center">{{showTip}}</p>
              <span slot="footer" class="dialog-footer">
                <!-- <el-button @click="centerDialogVisible = false">取 消</el-button>
                <el-button type="primary" @click="centerDialogVisible = false">确 定</el-button> -->
              </span>
          </el-dialog>
  </div>
</template>

<script>
import api from './../../api/api';
import http from './../../config/index';
import tzBreadcrumb from './../../components/breadcrumb/breadcrumb.vue'  
export default {
  components: {
    'tz-breadcrumb': tzBreadcrumb
  },
  data () {
    return {
      centerDialogVisible:false,
      showTip:'',
      loading:false,
      // 结账弹框统计数据
      settleAccountsAllPrice:{},
      // 餐厅信息
      restaurantInfoData :'',
      restaurantInfoImg:[],
      imgUrl:api.imgUrl,
      // 人数
      peopleVal: '',
      // 结账弹框的显示隐藏
      settleAccountsModel:false,
      // 备注
      remark:'',
      value:'',
      mStatusOption:[{
        value: '0',
        label: '空闲'
      },{
        value: '1',
        label: '下单中'
      },{
        value: '2',
        label: '有客'
      }],
      options: [{
        value: '0',
        label: '2019.04.01 11:00～14:00'
      }, {
        value: '1',
        label: '2019.04.01 14:00～17:00'
      }],
      activeNames: ['1'],
      // 餐桌列表
      restaurantList: [],
      restaurantListNoInfo:true,
      modifyStatus:false,
      isActive:0,
      isOpen:true,
      // 送餐信息是否展开
      sendOpenb:1,
      // 餐桌分类列表总和
      rList:[],
      rListNoInfo:true,
      // 菜品列表
      mList:[],
      // 默认餐桌地域分类选中样式
      areaClassActiveIndex:0,
      // 默认食品分类选中样式
      mListClassActive:0,
      // 当前点击的桌号的状态
      currentDeskStatus:'',
      // 当前点击的桌号
      currentdeskNum:'',
      // 是否被点击
      isClick:false,
      mStatus:'',
      // 0为空闲显示，2为 有客，1为下单，3为预定中
      placeOrderMain: 0,
      // 商品数量
      goodsNums: 0,
      // 商品价格
      price: 0,
      // 默认菜单详情是否展开，true为展开
      openMenuDetailStatus: [],
      openMenuDetailStatus1:[],
      openMenuDetailStatus2:[],
      // 弹框显示
      changeDeskModel:false,
      // 模拟框里桌号是否被选中
      deskBeSelect: false,
      beforeDeskNum: '',
      // 改单和打印的弹框
      logMenuClick:false,
      //下单列表
      orderList:[],
      // 复选框选中的值
      checkList:[],
      // 改单单选选中的值
      checkListChange:[],
      // 服务员下单复选框选中的值
      checkListServer:[],
      // 扫码下单复选框选中的值
      checkListCustom:[],
      // 打印和改单动态标题
      modelTitle:"",
      // 结账标题
      acountTitle:'',
      // 是否展示合并打印按钮
      showMergeBtn:false,
      // 预约及送餐列表
      sendAppointList:"",
      sendAppointNoInfo:false,
      // 是否改单，1为改单，0为正常下单
      changeOrder: 0,
      // 有客菜单列表
      menuList:[],
      // 服务员下单列表
      SList:[],
      // 扫码下单列表
      CList:[],
      // ordercode码链接的字符串
      menuOrdercodeStr:'',
      // 当前点击的order_code码
      currentCode:'',
      // 默认人数可以点击
      writePeopleVal:false,
      // 餐厅id
      restaurantId:'',
      // 默认选中的餐厅id
      restaurantIdDefault:"",
      // 是否是有客状态点过去的下单，1是，0不是
      orderAgainStatus:0,
      // 结账弹框相关参数
      payWayRadio: 2,
      refundWayRadio:'',
      payMoney: '',
      payMoneyShow: false,
      payRemark: '',
      // 右侧弹框是否出现
      payRightArea: false,
      // 支付方式状态1支付，2退款
      payStatus: 1,
      // 结账弹框里的支付记录列表
      payRecordList:[],
      // 结账弹框里的支付记录下的总价
      payRecordAllPrice:'',
      // 结账弹框里的改单后的总价
      EditPrice:0,
      // 扫码打印的内容是否全部打印,true为默认全部打印
      iSprintScanAll:'false',
      // 复选的长度
      checkALLLength:"",
      // 打印弹框的 需要打印的字段内容完整的拼接
      orderCodeAdd:{},
      countIsClickOption:false,
      // 改单弹框选中的菜单
      originMenu:{},
      // 改单选中的order_id
      currentOrderId:'',

    }
  },
  mounted ()  {
    console.log(5555);
    var that = this;
	var type_code = this.GetUrlParam("type_code");
	console.log(type_code);
	if(type_code != '') {
		http.post(api.getSellerId, {
		      type_code: type_code
		}, (res) => {
		  console.log(res);
		  console.log(res.data.id);
		  // that.programName = res.data.name;
      // that.programLogo = res.data.ewm_logo;
     
		  localStorage.setItem("name", res.data.name);
		  localStorage.setItem("ewm_logo", res.data.ewm_logo);
		  if(res.data.id != ""){
		    // 存储
		    localStorage.setItem("seller_id", res.data.id);
		    console.log(localStorage.getItem("seller_id")+'seller_id');
		    console.log(localStorage.getItem("seller_id"));
			  that.$forceUpdate();
        that.getRestaurantList();
        // alert("1818");
		  }else{
		    this.centerDialogVisible = true;
		    this.showTip = "链接不完整"
		  }
		}, () => {
		  console.log('网络错误');
		});
	}
    type_code = localStorage.getItem("type_code");
    if(type_code == null){
      if(this.GetUrlParam("type_code") == '') {
        this.centerDialogVisible = true;
        this.showTip = '链接不完整';
        return false;
      }
       localStorage.setItem("type_code", this.GetUrlParam("type_code"));
       type_code =  this.GetUrlParam("type_code");
    }
	
    var aa = localStorage.getItem("seller_id");
    if(aa == "undefined" || aa == null || aa == ""){
      var test = http.post(api.getSellerId, {
            type_code: type_code
      }, (res) => {
        console.log(res);
        console.log(res.data.id);
        // that.programName = res.data.name;
        // that.programLogo = res.data.ewm_logo;
        localStorage.setItem("name", res.data.name);
				localStorage.setItem("ewm_logo", res.data.ewm_logo);
        if(res.data.id != ""){
          // 存储
          localStorage.setItem("seller_id", res.data.id);
          console.log(localStorage.getItem("seller_id")+'seller_id');
          console.log(localStorage.getItem("seller_id"));
		  that.$forceUpdate();
          that.getRestaurantList();
        }else{
          this.centerDialogVisible = true;
          this.showTip = "链接不完整"
        }
      }, () => {
        console.log('网络错误');
      });
    }

    that.seller_id = localStorage.getItem("seller_id")
    // that.WebSocketTest();
    if(localStorage.getItem("seller_id") != null && this.GetUrlParam("type_code") == ''){
	  that.$forceUpdate();
      // 餐厅列表接口获取
      that.getRestaurantList();
    }
  
  },
  watch: {
		    '$route': function () {
				    // console.log("监视区域进入");
				    let that = this;
		            that.restaurantList = [];
					that.restaurantInfoData = "";
					that.rList = [];
					that.restaurantListNoInfo = true;
					that.rListNoInfo = true;
					alert("666");
					var type_code = that.GetUrlParam("type_code");
					if(that.GetUrlParam("type_code") != '') {
						http.post(api.getSellerId, {
						      type_code: type_code
						}, (res) => {
						  console.log(res);
						  console.log(res.data.id);
						  // that.programName = res.data.name;
						  // that.programLogo = res.data.ewm_logo;
						  localStorage.setItem("name", res.data.name);
										localStorage.setItem("ewm_logo", res.data.ewm_logo);
						  if(res.data.id != ""){
						    // 存储
						    localStorage.setItem("seller_id", res.data.id);
						    console.log(localStorage.getItem("seller_id")+'seller_id');
						    console.log(localStorage.getItem("seller_id"));
							that.$forceUpdate();
							that.getRestaurantList()
						  }else{
						    that.centerDialogVisible = true;
						    that.showTip = "链接不完整"
						  }
						}, () => {
						  console.log('网络错误');
						});
					}
					
					// alert("5555")
					
		     }
        // // 监听厨房名称
        // 'payMoney' : function (newval,oldval) {
        //    var regnumber = /^\d+(\.\d{1,2})?$/ //验证数字为整数或者带两位小数的正则表达式
        //     if(regnumber.test(oldval)){
        //         console.log(33);
        //         this.payMoneyShow = true;
        //     }else{
        //         this.payMoneyShow = false;
        //         console.log(44);
        //     }
        //     this.restaurant_name = newval.replace(regnumber,'');
        // }
    },
  computed: {
    
   // 计算当前选中的状态
   mStatus: {
      get: function () {
         return this.mStatus; //获取的时候直接获取值
      },
      set: function (value) {
         let str = '';
          switch (value) {
            case 0:
              str = '空闲';
              break;
            case 1:
              str = '下单中';
              break;
            case 2:
              str = '有客';
              break;
            case 3:
              str = '预定中';
              break;
          }
          return str;
      }
    }
  },
  methods: {
    WebSocketTest() {
      if ("WebSocket" in window)
      {
          alert("您的浏览器支持 WebSocket!");
          
          // 打开一个 web socket
          var ws = new WebSocket("ws://localhost:9998/echo");
          
          ws.onopen = function()
          {
            // Web Socket 已连接上，使用 send() 方法发送数据
            ws.send("发送数据");
            alert("数据发送中...");
          };
          
          ws.onmessage = function (evt) 
          { 
            var received_msg = evt.data;
            alert("数据已接收...");
          };
          
          ws.onclose = function()
          { 
            // 关闭 websocket
            alert("连接已关闭..."); 
          };
      }
      
      else
      {
          // 浏览器不支持 WebSocket
          alert("您的浏览器不支持 WebSocket!");
      }
    },
    GetUrlParam(paraName) {
      var url = document.location.toString();
      var arrObj = url.split("?");

      if (arrObj.length > 1) {
        var arrPara = arrObj[1].split("&");
        var arr;
        for (var i = 0; i < arrPara.length; i++) {
          arr = arrPara[i].split("=");
          if (arr != null && arr[0] == paraName) {
            return arr[1];
          }
        }
        return "";
      } else {
        return "";
      }
　　},
    // 取消点击事件
    cancelPayRight(){
      this.payRightArea = false;
    },
    // 把事件戳转换为日期格式
    getLocalTime(nS) {
      return new Date(parseInt(nS) * 1000).toLocaleString().replace(/:\d{1,2}$/,' ');
    },
    // 确认结账点击事件
    confirmSettlement(){
      let that = this;
      this.$confirm('确认结账吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
        center: true
      }).then(() => {
        // 订单结算接口
        http.post(api.ordersSettlement, {
          seller_id: localStorage.getItem("seller_id"),
          restaurant_id:that.restaurantId == "" ? that.restaurantIdDefault:that.restaurantId,
          desk_number:that.currentdeskNum
        }, (res) => {
          console.log(res);
          if(res.code == "10001"){
            // 获取分类餐桌全部数据
            that.getDeskAllList();
            that.$message({
              type: 'success',
              message: '结账成功'
            });
            // 结账弹框关闭
            this.settleAccountsModel = false;
            this.placeOrderMain = 0;
            // 状态为空闲
            this.currentDeskStatus = 0
          } else {
            this.$message({
              type: 'info',
              message: res.msg
            }); 
          }
        }, () => {
          console.log('网络错误');
        });
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消结账'
        });
        
      });  
      
    },
    // 餐桌支付详情记录
    getDeskPayList () {
      let that = this;
      // ordersDeskPayRecordList
      http.get(api.ordersDeskPayRecordList, {
        seller_id: localStorage.getItem("seller_id"),
        restaurant_id:that.restaurantId == "" ? that.restaurantIdDefault:that.restaurantId,
        desk_number:that.currentdeskNum,
      }, (res) => {
        console.log(res);
        // 结账弹框里的支付记录列表数据和合计价格
        that.payRecordList = res.data[0].list;
        that.payRecordAllPrice = res.data[0].total_price   
      }, () => {
        console.log('网络错误');
      });

    },
    // 支付和退款接口
    addPayRecordOption(stype,payStatus,refundStatus){
      var that = this;
      http.post(api.ordersAddPayRecord, {
        seller_id: localStorage.getItem("seller_id"),
        restaurant_id:that.restaurantId == "" ? that.restaurantIdDefault:that.restaurantId,
        type:stype,//0 支付 1退款
        // order_id:that.menuOrdercodeStr,
        pay_status:payStatus,
        refund_status:refundStatus,
        price:that.payMoney,
        desk_number:that.currentdeskNum,
        remark:that.payRemark
      }, (res) => {
        console.log(res);
        if(res.code == "10001"){
          // 详情刷新
          that.getOrdersDeskDetails();
          // 餐桌支付详情记录刷新
          that.getDeskPayList();
          that.payRemark = '';
          that.payMoney = '';
          if(stype == 0) {
            that.$message({
              type: 'success',
              message: '添加支付记录成功'
            });
          } else {
            that.$message({
            type: 'success',
            message: '添加退款记录成功'
            });
          }
        } else{
          this.$message({
            type: 'info',
            message: res.msg
          }); 
        }
        
      }, () => {
        console.log('网络错误');
      });
    },
    // 支付方式和退款操作确定点击事件
    paySureOption() {
      let that = this;
      if(that.payMoney == ''){
        that.$message({
          type: 'info',
          message: '价格为必填项'
        });
        return false;
      }
      // 如果是payStatus=1则是选择支付方式，否则是退款操作
      if(that.payStatus == 1) {
        if(that.payWayRadio == ""){
          that.$message({
            type: 'info',
            message: '请选择支付方式'
          }); 
          return false;
        }
        
        that.$confirm('确认添加此条支付记录吗?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning',
          center: true
        }).then(() => {
          console.log(888);
          // 添加支付记录
          that.addPayRecordOption(0,that.payWayRadio,'');
          
        }).catch(() => {
          that.$message({
            type: 'info',
            message: '已取消该操作'
          }); 
        });  
      }
      if(that.payStatus == 2){
        if(that.refundWayRadio == ""){
          that.$message({
            type: 'info',
            message: '请选择退款方式'
          }); 
          return false;
        }
        that.$confirm('确认添加此条退款记录吗?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning',
          center: true
        }).then(() => {
          // 退款操作
          that.addPayRecordOption(1,'',that.refundWayRadio);
        }).catch(() => {
          that.$message({
            type: 'info',
            message: '已取消该操作'
          });        
        });   
      }
    },
    payUpdate () {
      // this.payStatus = 1;
      this.payRightArea = !this.payRightArea;
    },
    // 订单批量改菜接口对接
    editBatchOption(goods_id_num){
      let that = this;
      console.log('86888');
      http.get(api.ordersEditBatch,{
        goods_id_num:goods_id_num,
        desk_number:that.currentdeskNum,
        seller_id:localStorage.getItem("seller_id"),
      }, (res) => {
        console.log(res);
        if(res.code =="10001"){
          that.$message({
            type: 'success',
            message: '批量改菜成功!'
          });
        } else {
          that.$message({
            type: 'info',
            message: res.msg
          });
        }
        // 关闭这个批量改菜的div
        this.payRightArea = !this.payRightArea;
        // 刷新获取餐桌详情
        this.getOrdersDeskDetails ();
      }, () => {
        console.log('网络错误');
        // that.loading = false;
      }); 
    },
    // 确定订单批量改菜点击事件
    payChangeStatus () {
      // 是否点击加减进行修改
      this.countIsClickOption = false;
      var that =this;
      var orderedit = {};
      that.SList.forEach(function(item,i){
        orderedit[item.id] = [];
        item.goods_list.forEach(function(item2,j){
          item2.type_goods_list.forEach(function(item3,y){
            orderedit[item.id].push({"num":item3.number,"id":item3.goods_id});
          })
        })
      })
      that.CList.forEach(function(item,i){
        orderedit[item.id] = [];
        item.goods_list.forEach(function(item2,j){
          item2.type_goods_list.forEach(function(item3,y){
            orderedit[item.id].push({"num":item3.number,"id":item3.goods_id});
          })
        })
      })
      console.log(orderedit);
      that.$confirm('确认修改吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
        center: true
      }).then(() => {
         that.editBatchOption(JSON.stringify(orderedit));
      }).catch(() => {
        console.log(2);
        that.$message({
          type: 'info',
          message: '已取消修改'
        });
        this.payRightArea = !this.payRightArea;
      });  
     
        // 若果修改后的价格为负数，则payStatus = 2（退款） ,否则为1，支付
        // this.payStatus = 2;
        // // 关闭这个批量改菜的div
        // this.payRightArea = !this.payRightArea;
    },
    // 获取餐桌详情
    getOrdersDeskDetails () {
      var that = this;
      console.log(that.currentdeskNum);
      http.get(api.ordersDeskDetails, {
        seller_id:localStorage.getItem("seller_id"),
        restaurant_id:that.restaurantId == "" ?that.restaurantIdDefault:that.restaurantId,
        desk_number:that.currentdeskNum
      }, (res) => {
        console.log(res);
        console.log(res.data);
        console.log(res.code);
        console.log(585858);
        if(res.code == "10001"){
          // 如果为负数
          if(res.data[0].need_pay < 0) {
             that.payStatus = 2;
          } else {
             that.payStatus = 1;
          }
          that.settleAccountsAllPrice = res.data[0]?res.data[0]:[];
          that.menuList = res.data[0].list;
          // 获取所有ordecode，组成新的字符串
          var menuArr=new Array();
          that.menuList.forEach(function (ele) {
            menuArr.push(ele.order_code); 
          })
          var menuOrdercodeStr = menuArr.join(",");
          that.menuOrdercodeStr = menuOrdercodeStr;
          var newArray  = [];//新数组
          var j = 0;  
          //查找符合条件值并存入新数组
          for(let i in that.menuList){
            if(that.menuList[i].type == '2'){
              newArray[j++] = that.menuList[i]
            }
          }
          newArray.forEach(function(item,x){
            that.openMenuDetailStatus[x] = new Array(item.goods_list.length);
            item.goods_list.forEach(function(item2,y){
              that.$set(that.openMenuDetailStatus[x],y,0)
            })
          });

          console.log(newArray)
          // 赋值服务员下单列表
          that.SList =  newArray;
          that.orderList = [];
          newArray.forEach(function(item,i){
            that.orderList.push({ "ordercode" : item.order_code, "goods_count":item.goods_list.lenght });
          });
          console.log(that.SList);
          // console.log(that.SList[0].goods_list);
          // console.log(that.SList[0].goods_list[0].1)

          // 赋值扫码下单列表
          var newArrayCustom  = [];//新数组
          var m = 0;
          //查找符合条件值并存入新数组
          for(let i in that.menuList){
            if(that.menuList[i].type == '1'){
              newArrayCustom[m++] = that.menuList[i]
            }
          }

          console.log(newArrayCustom);

          newArrayCustom.forEach(function(item,x){
            that.openMenuDetailStatus1[x] = new Array(item.goods_list.length);
            item.goods_list.forEach(function(item2,y){

              that.openMenuDetailStatus1[x][y] = 0;
            })
          });
          // 赋值扫码下单列表
          newArrayCustom.forEach(function(item,i){
            that.orderList.push({ "ordercode" : item.order_code, "goods_count":item.goods_list.length });
          });
          that.CList =  newArrayCustom;

        }
      }, () => {
        console.log('网络错误');
      });
    },
    // 在原基础上减少商品
    deletedMenu(orderid,type,id,ListType) {
      this.countIsClickOption = true;
      if(ListType ==1){
        let list = this.SList;
        list.forEach(function(item,i){
          if(item.id == orderid){
            item.goods_list.forEach(function(item2,j){
              if(item2.type == type){
                item2.type_goods_list.forEach(function(item3,y){
                  if(item3.id == id && item3.number>0){
                    item3.number = item3.number -1;
                  }
                })
              }
            })
          }
        })
        this.SList = list;
      }
      if(ListType ==2){
        let list2 = this.CList;
        list2.forEach(function(item,i){
          if(item.id == orderid){
            item.goods_list.forEach(function(item2,j){
              if(item2.type == type){
                item2.type_goods_list.forEach(function(item3,y){
                  if(item3.id == id && item3.number>0){
                    item3.number = item3.number -1;
                  }
                })
              }
            })
          }
        })
        this.CList = list2;
      }
      this.EditPrice = this.CalaulationOrder();
    },
    // 在原基础上增加商品
    addMenu(orderid,type,id,ListType){
      this.countIsClickOption = true;
      console.log(this.SList);
      if(ListType ==1){
        let list = this.SList;
        list.forEach(function(item,i){
          if(item.id == orderid){
            item.goods_list.forEach(function(item2,j){
              if(item2.type == type){
                item2.type_goods_list.forEach(function(item3,y){
                  if(item3.id == id && item3.number<999){
                    item3.number = item3.number +1;
                  }
                })
              }
            })
          }
        })
        this.SList = list;
      }
      if(ListType ==2){
        let list2 = this.CList;
        console.info(list2);
        console.log(id)
        list2.forEach(function(item,i){
          if(item.id == orderid){
            console.log(orderid)
            item.goods_list.forEach(function(item2,j){
              if(item2.type == type){
                console.log(type);
                item2.type_goods_list.forEach(function(item3,y){
                  console.log(item3.goods_id)
                  if(item3.id == id && item3.number<999){
                    item3.number = item3.number +1;
                  }
                })
              }
            })
          }
        })
        this.CList = list2;
        
      }
      this.EditPrice = this.CalaulationOrder();
    },
    // 删除商品
    deleted(id,cid,price) {
      let priceh = price * 1;
      let that = this;
      let list = that.mList;
      //修改商品列表数量
      list.forEach(function (ele) {
        console.log(ele.num);
        if (ele.id == cid && ele.num > 0) {
          ele.num = ele.num - 1;
          ele.goods.forEach(function (eele) {
            if (eele.id == id) {
              eele.num = eele.num - 1;
            }
          })
        }
      })
      that.mList = list;
      that.goodsNums = that.goodsNums - 1;
      that.price = that.price - priceh <= 0 ? 0 : that.price - priceh;
      console.log(that.price);
    },
    // 增加商品
    add(id,cid,price) {
      let priceh = price * 1;
      let that = this;
      let list = that.mList;
      console.log('id'+id);
      console.log('cid'+cid);
      console.log('price'+priceh);
      console.log(list);
      //修改商品列表数量
      list.forEach(function (ele) {
        if (ele.id == cid) {
          ele.num = ele.num + 1;
          console.log(ele.num);
          ele.goods.forEach(function (eele) {
            if (eele.id == id) {
              eele.num = eele.num + 1;
              console.log(eele.num);
            }
          })
        }
      })
      that.mList = list;
      that.goodsNums = that.goodsNums + 1;
      that.price = priceh + that.price
    },
    //计算订单金额
    CalaulationOrder(){
      var orderPrice=0;
      var list = this.SList;
      list.forEach(function(item,i){
        item.goods_list.forEach(function(item2,j){
          item2.type_goods_list.forEach(function(item3,y){
            orderPrice = orderPrice + item3.number * parseFloat(item3.price);
          })
        })
      })
      var list2 = this.CList;
      list2.forEach(function(item,i){
        item.goods_list.forEach(function(item2,j){
          item2.type_goods_list.forEach(function(item3,y){
            orderPrice = orderPrice + item3.number * parseFloat(item3.price);
          })
        })
      })
      return orderPrice;
    },
    // 订单改菜接口请求
    getMenuModify(goods_id_num,order_id){
      let that = this;
      http.post(api.ordersEdit, {
        goods_id_num:goods_id_num,
        desk_number:that.currentdeskNum,
        seller_id:localStorage.getItem("seller_id"),
        order_id:order_id
      }, (res) => {
        console.log(res);
        if(res.code =="10001"){
          that.$message({
            type: 'success',
            message: '改菜成功!'
          }); 
        } else {
          that.$message({
            type: 'info',
            message: res.msg
          });
        }
        // 到有客
        that.placeOrderMain = 2;
        // 刷新获取餐桌详情
        this.getOrdersDeskDetails ();
      }, () => {
        console.log('网络错误');
        // that.loading = false;
      }); 
      
    },
    // 打印接口请求
    print (orderCodeAdd,dinnerType) {
      let that = this;
      http.post(api.ordersPrints, {
        order_code_add:orderCodeAdd,
        dinner_type:dinnerType,
        seller_id:localStorage.getItem("seller_id")
      }, (res) => {
        console.log(res);
        that.orderCodeAdd = {};
        if(res.code == '10001'){
          that.$message({
            type: 'success',
            message: '打印成功!'
          });
        } else {
          that.$message({
            type: 'info',
            message: res.msg
          });

        }
        
      }, () => {
        console.log('网络错误');
        that.orderCodeAdd = {};
        // that.loading = false;
      }); 
    },
    // 拼接成{a:b}
    toObj1(key,val){
      var data = {};
      data[key] = val;
      return data;
    },
    // 数组去重
    quchong(arr){
      var len = arr.length;
      arr.sort();
        for(var i=len-1;i>0;i--){
          if(arr[i]==arr[i-1]){
              arr.splice(i,1);
            }
      }
      return arr;
    },
    // 合并对象方法
    extend(target, source) { 
      for (var obj in source) {
        target[obj] = source[obj];
      } 
      return target;
    },
    // 打印点击确定事件和改单确定
    surelogMenuClick(title) {
      let that = this;
      console.log(that.checkList);
      if(title.indexOf('打印') != -1){
        if(that.checkList.length == 0 && that.checkListServer.length == 0){
          this.$message({
            type: 'info',
            message: '请至少勾选1个菜单，方可进行打印操作'
          });
          return false;
        }
        var printMemuNum=[];
        var arr = [];
        var t = 0;
        console.log(that.menuList);
        // 获取全部选中的值返回新的arr数组
        for (var i =0;i<that.menuList.length;i++) {
          for (var z =0;z<that.checkList.length;z++) {
            if(that.menuList[i].order_code == that.checkList[z]){
              arr[t++] = that.menuList[i]
            }
          }
        }
        console.log(arr);
        let obj1_noCustom = {};
        let printlist = JSON.stringify(arr);
        let list = JSON.parse(printlist);
        console.log(list);
        // 没有勾选扫码下单子集的情况下
        // 获取全部选中的值拼接成{a:b,c:e}
        for (let i = 0; i < list.length; i++) {
          // 再次循环重置为空
            var printMemuNum = [];
            for (let m = 0; m < list[i].goods_list.length; m++) {
              printMemuNum.push(m+1);
              var str2 = that.quchong(printMemuNum);
              console.log(str2.join(','));       
            }
            obj1_noCustom[list[i].order_code] = str2.join(',');     
        };
           var arrC = new Array();
           var obj2 = {};
           var connectObj = {};
          // 扫码点餐部分选中的情况下
          if(that.checkListServer.length != 0 && that.checkList.length == 0) {
            that.checkListServer.forEach(function(item,i){ 
              console.log(item);
              var tmp_arr = item.split(",");
              arrC.push(tmp_arr[1]);     
            })
            var str=arrC.join(",");
              // 打印扫码的全部
            obj2 = that.toObj1(that.CList[0].order_code,str);
            console.log(obj2);
            // 拼接两个对象
            connectObj = that.extend(obj2, obj1_noCustom);
            console.log(connectObj);
          }
          if(that.checkListServer.length != 0 ) {
            that.orderCodeAdd = connectObj;
          } else {
            that.orderCodeAdd = obj1_noCustom;
          }
        console.log(that.orderCodeAdd);
        that.$confirm('确认打印吗?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning',
          center: true
        }).then(() => {
          console.log(1);
          // 关闭弹框
          that.logMenuClick = false;
          console.log(JSON.stringify(that.orderCodeAdd));
          // 打印接口对接
          that.print(JSON.stringify(that.orderCodeAdd),2);
        }).catch(() => {
          console.log(2);
          that.$message({
            type: 'info',
            message: '已取消打印'
          });
          // 关闭换桌的弹框
          that.logMenuClick = false;
          that.checkList = '';
        });  
      } else if(title.indexOf('改单') != -1){
        if(that.checkListChange[0] == null){
          that.$message({
            type: 'info',
            message: '请勾选你需要修改的菜单'
          });
          return false;
        }
        that.$confirm('确认修改该订单吗?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning',
          center: true
        }).then(() => {
          // 人数不可修改
          that.writePeopleVal = true;
          that.menuList.forEach(function (item) {
            if (item.order_code == that.checkListChange[0]) {
              that.currentOrderId = item.id ;
            }
          })
          console.log(that.currentOrderId);
          console.log(1);
          // 关闭弹框
          that.logMenuClick = false;
          // 接口请求获取订单种类和数量商品
          that.getorderGoods(that.checkListChange[0]);
          // 到点菜页面
          this.placeOrderMain = 1;
          console.log(that.checkList[0]);
          that.changeOrder = 1;
          // that.menuList.forEach(function(item,i){
          //   if()
          // })
          for(var i = 0;i<that.menuList.length;i++){
            if(that.menuList[i].order_code == that.checkList[0]){
              console.log(that.menuList[i]);
            }
          } 
        }).catch(() => {
          console.log(2);
          that.$message({
            type: 'info',
            message: '已取消修改该订单'
          });
          // 关闭换桌的弹框
          that.logMenuClick = false;
          that.checkList[0] = '';
          that.changeOrder = 0;
        });  
      }
    },
    // 获取订单种类和商品数量
    getorderGoods (order_code) {
      let  that = this;
      http.get(api.ordersGoods,{
        order_code:order_code,
        seller_id:localStorage.getItem("seller_id")
      },(res)=>{
        console.log(res);
        that.originMenu = res.data;
        that.goodsNums = 0
        that.price = 0
        let list = that.mList;
        list.forEach(function(item,i){
          that.originMenu.goods.forEach(function(item1,o){
            if(item1.cid == item.id){
              item.goods.forEach(function(item2,j){
                if(item2.id == item1.goods_id){
                  item.num = item.num+item1.number;
                  that.goodsNums = that.goodsNums + +item1.number;
                  that.price = that.price + item1.number * parseFloat(item1.price);
                  item2.num = item1.number;
                }
              })
            }
          })
        })
        that.mList = list;
        console.log(that.mList);
        // let list = this.SList;
        // list.forEach(function(item,i){
        //   if(item.id == orderid){
        //     item.goods_list.forEach(function(item2,j){
        //       if(item2.type == type){
        //         item2.type_goods_list.forEach(function(item3,y){
        //           if(item3.id == id && item3.number<999){
        //             item3.number = item3.number +1;
        //           }
        //         })
        //       }
        //     })
        //   }
        // })
        // this.SList = list;
        that.peopleVal = res.data.num;
      },()=>{
        console.log('网络错误');
      })
      
    },
    // 合并打印点击事件
    logMenuClickMerge () {
      let that = this;
      // connectObj = that.extend(obj2, obj1_noCustom);
      // 扫码下单
      var printMemuNum=[];
      var arr = [];
      var t = 0;
      console.log(that.menuList);
      // 获取全部选中的值返回新的arr数组
      let obj1_noCustom = {};
      let printlist = JSON.stringify(that.menuList);
      let list = JSON.parse(printlist);
      console.log(list);
      // 没有勾选扫码下单子集的情况下
      // 获取全部选中的值拼接成{a:b,c:e}
      for (let i = 0; i < list.length; i++) {
        // 再次循环重置为空
          var printMemuNum = [];
          for (let m = 0; m < list[i].goods_list.length; m++) {
            printMemuNum.push(m+1);
            var str2 = that.quchong(printMemuNum);
            console.log(str2.join(','));       
          }
          obj1_noCustom[list[i].order_code] = str2.join(',');     
      };
      console.log(obj1_noCustom);
      this.$confirm('确认全部合并打印吗?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning',
          center: true
        }).then(() => {
          console.log(1);
          // 关闭换桌的弹框
          this.logMenuClick = false;
          // 接口对接
          this.print(JSON.stringify(obj1_noCustom),2);
        }).catch(() => {
          console.log(2);
          this.$message({
            type: 'info',
            message: '已取消合并打印'
          });
          // 关闭换桌的弹框
          this.logMenuClick = false;
        });  
    },
    // 部分选中复选框事件
    handleCheckedLeft(event) {
      console.log(event);
      var that = this;
      that.orderList.forEach(function(item,i){
        let clcount = 0;
        let allcount = item.goods_count;
        // 子集
        console.log(that.checkListServer);
        // 父级
        console.log(that.checkList);
        that.checkListServer.forEach(function(itema,x){
          let avg = itema.split(',');
          if(item.ordercode==avg[0]){
            clcount++;
            console.log(that.checkList.indexOf(item.ordercode));
            if(allcount == clcount && that.checkList.indexOf(item.ordercode)<0){
              let cl = that.checkList;
              cl.push(item.ordercode);
              that.checkList = cl;
              console.log(that.checkList);
              // 置空
              that.checkListServer = [];
              return;
            }else {
              if(that.checkList.indexOf(item.ordercode)>-1){
                let tl = that.checkList;
                tl.splice(that.checkList.indexOf(item.ordercode),1)
                that.checkList = tl;
                console.info(that.checkList);
                // console.log(that.checkListServer);
              }
            }
          }
        })
      })
      
    },
    // 复选点击事件
    handleCheckedAll(event) {
      console.log(event);
      console.log(event.length);
      let that = this;
      that.checkALLLength = event.length;
      console.log(event.indexOf(that.CList[0].order_code))
      // 如果包含扫码点餐全部
      if (that.checkList.indexOf(that.CList[0].order_code) > -1 ) {
         that.iSprintScanAll = true;    
         that.checkListServer = [];
      } else {
         that.iSprintScanAll = false; 
      }
      that.orderList.forEach(function(item,i){
        let clcount = 0;
        let allcount = item.goods_count;
        that.checkListServer.forEach(function(itema,x){
          let avg = itema.split(',');
          if(item.ordercode==avg[0]){
            clcount++;
            console.log(that.checkList.indexOf(item.ordercode));
            if(allcount == clcount && that.checkList.indexOf(item.ordercode)<0){
              let cl = that.checkList;
              cl.push(item.ordercode);
              that.checkList = cl;
              // 置空
              this.checkListServer = [];
              console.log(that.checkList);
              return;
            }else {
              if(that.checkList.indexOf(item.ordercode)>-1){
                let tl = that.checkList;
                tl.splice(that.checkList.indexOf(item.ordercode),1)
                that.checkList = tl;
                console.info(that.checkList);
              }
            }
          }
        })
      })
    },
    // 改单全选点击事件
    handleCheckedAllChange(event) {
      console.log(event);
    },
    
    // 关闭改单和打印弹框
    closeLogMenu () {
      this.logMenuClick = false;
    },
    // 打印和改单点击事件
    logMenuChangeClick(val){
      this.checkListServer = [];
      this.checkList = [];
      this.orderCodeAdd = {};
      // 1为打印点击进来的弹框，0为改单进来的弹框
      if(val == 1) {
        this.logMenuClick = true;
        this.modelTitle = '请选择需要打印的菜单';
        this.showMergeBtn = true;
      } else {
        this.logMenuClick = true;
        this.modelTitle = '请选择需要改单的菜单';
        this.showMergeBtn = false;
        // 勾选的被清空
        this.checkListChange = [];
        
      }
      //清空商品数量
        let list = this.mList;
        list.forEach(function (ele) {
          console.log(ele.num);
          ele.num = 0;
          // if (ele.id == cid && ele.num > 0) {
          //   ele.num = ele.num - 1;
            ele.goods.forEach(function (eele) {
                eele.num = 0;
            })
          // }
        })
        this.mList = list;
        console.log(this.mList);
    },
    // 取消换桌 x点击事件
    handleCloseChangeDesk () {
      // 桌号恢复原先操作的桌号
      this.currentdeskNum = this.beforeDeskNum;
      // 关闭换桌的弹框
      this.changeDeskModel = false;
      this.$message({
          type: 'info',
          message: '已取消换桌号'
      });
    },
    // 确定换桌
    sureChangeDesk() {
      let that = this;
      if(that.currentDeskStatus != 0){
         // 桌号恢复原先操作的桌号
        that.currentdeskNum = that.beforeDeskNum;
        that.$message({
          type: 'info',
          message: '您未勾选桌号，请选择空闲的桌号进行选择'
        });
        return false;
      }
      that.$confirm('确认修改桌号吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
        center: true
      }).then(() => {
        console.log(1);
        // 关闭换桌的弹框
        that.changeDeskModel = false;
        that.loading = true;
        // 接口对接
        http.post(api.ordersEditDesk, {
          seller_id:localStorage.getItem("seller_id"),
          restaurant_id:that.restaurantId == "" ? that.restaurantIdDefault:that.restaurantId,
          order_code:that.menuOrdercodeStr,
          desk_number:that.currentdeskNum,
          old_desk_number:that.beforeDeskNum
        }, (res) => {
          console.log(res);
          that.loading = false;
          if(res.code== '10001'){
             that.getDeskAllList();
             that.$message({
                type: 'success',
                message: '换桌号 成功!'
             });
             that.currentDeskStatus = 2;
             
          } else {
             that.$message({
                type: 'info',
                message: res.msg
             });
            // 桌号恢复原先操作的桌号
            that.currentdeskNum = that.beforeDeskNum;
          }
        }, () => {
          console.log('网络错误');
          that.loading = false;
        });
        
           
      }).catch(() => {
        console.log(2);
        this.$message({
          type: 'info',
          message: '已取消换桌号'
        });
        // 关闭换桌的弹框
        this.changeDeskModel = false;
        // 桌号恢复原先操作的桌号
        this.currentdeskNum = this.beforeDeskNum;
      });  
    },
    // 改桌弹框
    changeDesk (beforeDeskNum) {
      // 记录上一个获取的桌号
      this.beforeDeskNum = beforeDeskNum;
      console.log(this.beforeDeskNum);
      // 显示弹框
      this.changeDeskModel = true;

    },
    // 点击结账按钮点击事件
    settleAccounts(){
      let that = this;
      // 获取餐桌详情
      that.getOrdersDeskDetails ();
      // 餐桌支付详情记录刷新
      that.getDeskPayList();
      // 结账弹框显示
      that.settleAccountsModel = true;
      console.log(that.rList);
      var deskClass = "";
      that.rList.forEach(function(item,y){
        item.goods.forEach(function(itema,k){
           if(itema.desk_number == that.currentdeskNum) {
              deskClass = item.title;
           }
        })
      })
      // 结账弹框标题
      that.acountTitle = deskClass + that.currentdeskNum + '结账';
      // 如果需支付金额大于0，则是支付状态，否则是退款
      if(that.settleAccountsAllPrice.need_pay >=0) {
        that.payStatus = 1
      } else {
        that.payStatus = 2
      }
    },
    // 下单点击事件
    placeOrderAgain () {
      this.goodsNums = 0;
      this.price = 0;
      // 恢复正常下单
      this.changeOrder = 0;
      // 返回有客状态去下单
      this.placeOrderMain = 1;
      // 再次下单点过去带的参数
      this.orderAgainStatus = 1;
      // 输入人数不能点击
      if (this.SList != ''){
        this.writePeopleVal = true;
        this.peopleVal = this.menuList[0].num;
      }
      console.log(this.peopleVal);
      //清空商品数量
      let list = this.mList;
      list.forEach(function (ele) {
        console.log(ele.num);
        ele.num = 0;
        // if (ele.id == cid && ele.num > 0) {
        //   ele.num = ele.num - 1;
        ele.goods.forEach(function (eele) {
            eele.num = 0;
        })
        // }
      })
      this.mList = list;
      console.log(this.mList);
    },
    login () {
      this.$router.push('login')
    },
    // 跳转修改餐厅页面带参数
    addRestaurant (id,restaurantData) {
      // this.$router.push('add-restaurant')
      this.$router.push({
        path: '/add-restaurant',
        query: {
          id , restaurantData
        }
      });
    },
    addRestaurantDesk (id) {
      this.$router.push({
        path: '/restaurant-desk-manage',
        query: {
          id: id
        }
      });
    },
    // 跳新增餐厅页面不带参数
    addRestaurantNoparm () {
      this.$router.push('add-restaurant')
    },
		restaurantInfo (id) {
      // this.$router.push('restaurant-info-manage')
      this.$router.push({
        path: '/restaurant-info-manage',
        query: {
          id: id
        }
      });

    },
    deskCode(id) {
      this.$router.push({
        path: '/desk-code',
        query: {
          id: id
        }
      });
    },
    orderManage(id){
      this.$router.push({
        path: '/order-manage',
        query: {
          id: id
        }
      });
    },
    restaurantDeskInfo () {
      this.$router.push('restaurant-desk-manage')
    },
    pay () {
      this.$router.push('pay-restaurant')
    },
    // 选择餐厅点击事件
    selectRestaurant (id,index) {
      var that = this;
      console.log(id);
      that.isActive = index;
      that.restaurantId = id;
      console.log(that.restaurantId);
      that.restaurantInfoData  = that.restaurantList[index];
      that.restaurantInfoImg = that.restaurantList[index].img.split(',');
      console.log(that.restaurantList[index]);
      // 获取分类餐桌全部数据
      that.getDeskAllList();
      // 获取餐品全部数据
      that.getGoodsAllList();

    },
    handleChange(val) {
      console.log(val);
      console.log(val.length);
      if (val.length == 1) {
        this.isOpen = true
      } else {
        this.isOpen = false
      }
    },
    // 详情是否展开
    openMenuDetail (faType,currentType,currentCode) {
      let oldArr;
      let newArr;
      switch (currentCode) {
        case 's':
          oldArr =  this.openMenuDetailStatus ;
          newArr = oldArr.slice(0);
          newArr[faType][currentType] = 0;
          this.openMenuDetailStatus = newArr;
          break;
        case  'c':
          oldArr =  this.openMenuDetailStatus1 ;
          newArr = oldArr.slice(0);
          newArr[faType][currentType] = 0;
          this.openMenuDetailStatus1 = newArr;
          break;
        case  'sa':
          oldArr =  this.openMenuDetailStatus2 ;
          newArr = oldArr.slice(0);
          newArr[faType][currentType] = 0;
          this.openMenuDetailStatus2 = newArr;
          break;
      }

    },
    openMenuDetailOpen(faType,currentType,currentCode){
      let oldArr;
      let newArr;
      switch (currentCode) {
        case 's':
          oldArr =  this.openMenuDetailStatus ;
          newArr = oldArr.slice(0);
          newArr[faType][currentType] = 1;
          this.openMenuDetailStatus = newArr;
          break;
        case  'c':
          oldArr =  this.openMenuDetailStatus1 ;
          newArr = oldArr.slice(0);
          newArr[faType][currentType] = 1;
          this.openMenuDetailStatus1 = newArr;
          break;
        case  'sa':
          oldArr =  this.openMenuDetailStatus2 ;
          newArr = oldArr.slice(0);
          newArr[faType][currentType] = 1;
          this.openMenuDetailStatus2 = newArr;
          break;
      }
    },
    // 送餐信息收起展开按钮点击事件
    OpenSend(sendOpen) {
       console.log(sendOpen);
       // 默认展开的时候为1，点击即为收起
       if (sendOpen == 1) {
          this.sendOpenb = 2;
          console.log(this.sendOpenb);
       } else {
          this.sendOpenb = 1;
          console.log(this.sendOpenb);
       }
       
    },
    // 食品分类点击事件
    mListClassClick (e) {
      this.mListClassActive = e;
      console.log(this.mListClassActive); 
    },
    // 区域分类点击事件
    areaClassClick (e) {
      this.areaClassActiveIndex = e;
      console.log(this.areaClassActiveIndex); 
    },
    // 对应的桌号状态点击
    deskStatusClick (deskNum,menu) {
      // status 0为空闲，2为 有客，1为下单，3为预定中
      this.currentdeskNum = deskNum;
      var that = this;
      console.log(menu);
      menu.forEach(function(elemet) {
        if (elemet.desk_number == deskNum) {
          that.currentDeskStatus = elemet.status;
          console.log(that.currentDeskStatus);
        }
        // 0 空闲，1下单中，2有客
        if(that.currentDeskStatus == 2) {
          that.placeOrderMain = 2;
          // 获取餐桌详情
          that.getOrdersDeskDetails();
        } else if(that.currentDeskStatus == 0) {
          that.placeOrderMain = 0
        } else if(that.currentDeskStatus == 1) {
          that.placeOrderMain = 0
        }
      });
      // 首页左侧内容对应的状态内容显示
      that.isClick  = true;
    },
    // 换桌弹框点击对应的桌号点击事件
    deskStatusClickModel(deskNum,menu) {
      // status 0为空闲，2为 有客，1为下单，3为预定中
      this.currentdeskNum = deskNum;
      var that = this;
      console.log(menu);
      menu.forEach(function(elemet) {
        if (elemet.desk_number == deskNum) {
          that.currentDeskStatus = elemet.status;
          console.log(that.currentDeskStatus);
        }
        // 0 空闲，1下单中，2有客 空闲的时候
        if(that.currentDeskStatus == 0) {
          that.deskBeSelect = true;
        } else {
          that.deskBeSelect = false;
        }
      });

    },
    // 点击下单
    placeOrderClick () {
      this.placeOrderMain = 1;
      this.currentDeskStatus = '1';
      this.changeOrder = 0;
      // 第一步点过去带过去的参数，让取消知道回哪一步
      this.orderAgainStatus = 0;
      // 人数可以填
      this.writePeopleVal = false;
      this.peopleVal = '';
      // 清空num
      let list = this.mList;
      list.forEach(function (ele) {
        console.log(ele.num);
        ele.num = 0;
        // if (ele.id == cid && ele.num > 0) {
        //   ele.num = ele.num - 1;
          ele.goods.forEach(function (eele) {
              eele.num = 0;
          })
        // }
      });
      this.goodsNums = 0;
      this.price = 0;
      this.mList = list;
      console.log(this.mList);

    },
    // 下单中取消点击事件
    cancelPlaceOrder () {
      // 当是下单按钮点过来和改单弹框确定点过来时，取消返回到有客界面
      if(this.orderAgainStatus == 1 || this.changeOrder == 1){
        this.placeOrderMain = 2;
        // 取消改单时候按钮字体正常显示
        this.changeOrder = 0;
      }else{
        this.placeOrderMain = 0;
      }
    },
    // 下单中确定按钮点击事件
    surePlaceOrder () {
      if(this.peopleVal == '') {
        this.placeOrderMain = 1;
        this.$message({
          showClose: true,
          message: '人数不能为空',
          type: 'error'
        });
        return false;
      } 
      // else {
      //   // 有客状态中显示内容
      //   this.placeOrderMain = 2;
      //   this.currentDeskStatus = 2;
      // }
      var that = this;
      let arr = [];
      that.loading = true;
      let list = that.mList;
      for (var i = 0; i < list.length; i++) {
        list[i].goods.map(ele => {
          if (ele.num > 0) {
            arr.push(ele);
          }
        })
      }
      that.loading = false;
      if (arr.length == 0) {
        this.$message({
          showClose: true,
          message: '请选择需要下单商品',
          type: 'error'
        });
        return false;
      }
      // 正常下单时
      if (that.changeOrder == 0) {
        let goods_id_num = {};
        let cartlist = JSON.stringify(arr);
        let list = JSON.parse(cartlist);
        for (let i = 0; i < list.length; i++) {
          goods_id_num[list[i].id] = list[i].num;
        };
        console.log(JSON.stringify(goods_id_num));
        http.post(api.ordersCreate, {
          seller_id:localStorage.getItem("seller_id"),
          restaurant_id:that.restaurantId == "" ? that.restaurantIdDefault:that.restaurantId,
          goods_id_num:JSON.stringify(goods_id_num),
          desk_number:that.currentdeskNum,
          num:that.peopleVal,
          remark:that.remark
        }, (res) => {
          console.log(res);
          // 获取分类餐桌全部数据
          that.getDeskAllList();
          // 有客状态中显示内容
          that.placeOrderMain = 2;
          that.currentDeskStatus = 2;
          // 获取餐桌详情
          that.getOrdersDeskDetails();

        }, () => {
          console.log('网络错误');
        });
      } else {
        let new_goods_list = {}
        this.mList.forEach(function(item,i){
          item.goods.forEach(function(item2,j){
            if(item2.num > 0){
              new_goods_list[item2.id] = item2.num;
            }
          })
        })
        console.log(new_goods_list);
        // 订单改菜接口请求
        that.getMenuModify(JSON.stringify(new_goods_list),that.currentOrderId);
      }
    },
    // 修改状态点击事件
    modifyStatusClick(a,b){
      this.currentDeskStatus = b;
      this.currentdeskNum = a;
      this.modifyStatus = true;
      if(this.currentDeskStatus == 0) {
        this.mStatus = '0'
      } else {
        this.mStatus = '1'
      }
    },
    // 获取餐厅列表
    getRestaurantList(){
      let that = this;
      // that.loading = true;
      console.log(localStorage.getItem("seller_id"));
      http.get(api.restaurantList, {
        seller_id: localStorage.getItem("seller_id")
      }, (res) => {
		that.loading = false;
        console.log(res);
		console.log("获取餐厅列表");
        
        if(res.data == ''){
          that.restaurantListNoInfo = true;
        } else{
          that.restaurantListNoInfo = false;
        }
        if (res.code == '10001'){
          that.restaurantList = res.data;
		  console.log(that.restaurantList);
          that.restaurantInfoData = res.data[0];
          that.restaurantInfoImg = res.data[0].img.split(',');
		  
        } else {
          // console.log(res.msg);
        }
       
        // 默认选中第一个餐厅ID
        that.restaurantIdDefault = res.data[0].id;
        console.log(that.restaurantId);
        console.log(292929);
        // 获取分类餐桌全部数据
        that.getDeskAllList();
        // 获取餐品全部数据
        that.getGoodsAllList();
      }, (error) => {
		   that.loading = false;
           console.log(error);
       
      }); 
    },
    // 获取分类餐桌全部数据
    getDeskAllList(){
      let that = this;
      http.get(api.deskAllList, {
        seller_id: localStorage.getItem("seller_id"),
        restaurant_id:that.restaurantId == "" ? that.restaurantIdDefault:that.restaurantId
      }, (res) => {
        if(res.data == ''){
          that.rListNoInfo = true
        } else{
          that.rListNoInfo = false
        }
        console.log(res);
        that.rList = res.data;
      }, (err) => {
        console.log(err);
      }); 
    },
    // 获取分类商品组合接口
    getGoodsAllList(){
      let that = this;
      http.get(api.goodsAllList, {
        seller_id: localStorage.getItem("seller_id"),
        restaurant_id:that.restaurantId == "" ? that.restaurantIdDefault:that.restaurantId
      }, (res) => {
        console.log(res);
        res.data.forEach(function (ele) {
          ele.num = 0;
          ele.goods.map(item => {
            item.num = 0;
          });
        })
        that.mList = res.data;
      }, (err) => {
        console.log(err);
        
      }); 
    }
    
  }
}
</script>

<style scoped>
.send-info-border .left-info{
  border-right:1px solid #e7e7e7;
}
.send-info-border .right-info{
  color:#333;
  font-size:16px;
  height:415px;
  position: relative;
  
}
.send-info-border .right-info .title{
  margin-bottom:10px;
}
.right-info-border{
  padding-left:20px;
  box-sizing: border-box;
  position: relative;
  max-height:415px;
  padding-bottom:50px;
 
}
.send-info-border .left-info .send-info:first-child{
  padding-top:0px;
}
.send-info{
  color:#333;
  font-size:16px;
  padding:20px 20px 0 0;
  box-sizing: border-box;
  border-bottom: 1px solid #e7e7e7;

}
.send-info-common{
  display: flex;
  padding-bottom:15px;
  box-sizing: border-box; 
}
.send-info-title{
  margin-bottom: 20px;
}
.send-info-common .left{
  width:100px;
  color:#999;
}
.send-info-common .right{
  flex:1;
}
.send-status-top{
    display: flex;
    justify-content: space-between
}
.send-status-top .orange-font{
    color:#FF6F2E;
}
.s-list-title-remark{
  font-size: 14px;
  color:#333;
  margin-top:5px;
}
.box{
  height: 100%;
  text-align:left;
  margin-top:20px;
}
.box-btn {
  position: absolute;
  bottom:30px;
  left:0px;
  width: 100%;
  z-index:1;
}
.box-btn button{
  width:43%;
}
.form-border {
  padding-top:15px;
  box-sizing: border-box;
  border-top:1px solid #e7e7e7;
}
.el-form-item {
    margin-bottom: 15px;
}
html {
  font-size: 100px;
} 
body{
  font-size:14px;
}
.section-one,.section-two {
  margin-top:10px;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0,0,0,.06);
  -webkit-box-shadow: 0 1px 3px rgba(0,0,0,.06);
  -o-box-shadow: 0 1px 3px rgba(0,0,0,.06);
  -ms-box-shadow: 0 1px 3px rgba(0,0,0,.06);
  -moz-box-shadow: 0 1px 3px rgba(0,0,0,.06);
}
.section-one {
  background:#fff;
  line-height:70px;
  padding:0 10px;
  box-sizing: border-box;
  color:#333;
  font-size:16px;
}
.section-one .left span {
  margin-right:15px;
  padding-bottom:22px;
  box-sizing: border-box;
  cursor: pointer;
}
.section-one .left span:last-child {
  margin-right:0px;
}
.add-btn {
  width:90px;
  float:right;
  color:#FF6F2E;
  font-size:16px;
  margin-right:10px;
  cursor: pointer;
}
.add-btn .el-icon-plus{
   margin-right:5px;
}
.active{
  border-bottom:3px solid #FF6F2E
}
.el-collapse{
  border-top:0px solid #fff;
  border-bottom:0px solid #fff;
}
.section-two {
  position: relative;
  padding:0 15px;
  box-sizing: border-box;
}
.s-t-edit-border {
  position: absolute;
  top: 15px;
  left: 80px;
  height:35px;
  cursor: pointer;
  font-size:14px;
  color:#FF6F2E
}
.s-t-txt {
  position: absolute;
  top: 15px;
  right: 40px;
  color:#333
}
.el-icon-edit{
  margin-left:5px;
}
.el-collapse-item__header{
  font-size:16px;
}
.s-t-main{
  border-top:1px solid #e7e7e7
}
.s-t-info {
  padding:15px 0;
  box-sizing: border-box;
  display: flex;
}
.s-t-info .left {
  width:100px;
}
.s-t-info .right {
  flex:1;
  padding-left:8px;
  box-sizing: border-box;
  color:#333;
  padding-top:5px;
  box-sizing: border-box;
}
.s-t-info .right h4{
  font-size:18px;
  font-weight: normal
}
.s-t-info .right p {
  font-size:14px;
}
.s-t-head-img{
  width:100px;
  height:100px;
  border-radius:5px;
}
.introduce {
  padding-top:25px;
  font-size:14px;
  color:#333;
  height:95px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  display: -o-box;
  display: -moz-box;
  display: -ms-box;
  -webkit-line-clamp: 3;
  -o-line-clamp: 3;
  -moz-line-clamp: 3;
  -ms-line-clamp: 3;
  -webkit-box-orient: vertical;
  -o-box-orient: vertical;
  -ms-box-orient: vertical;
  -moz-box-orient: vertical;
}
.s-t-img-show img {
  width:300px;
  height:180px;
  border-radius:5px;
  margin-right:20px;
  margin-bottom:20px;
}
.s-t-img-show img:last-child{
  margin-right:0px;
}
.s-t-btn-border{
  border-top:1px solid #e7e7e7;
  padding:15px 0 0 0;
}
.section-three {
  margin-top:10px;
  width:100%;
  height:750px;
}
.s-three-one,.s-three-two,.s-three-three {
  float:left
}
.s-three-one {
  width:26%;
  height:750px;
  overflow: hidden;
}
.s-three-two {
  width:66%;
  padding-right:20px;
  box-sizing: border-box;
}
.s-t-center-border {
  box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
  -webkit-box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
  -o-box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
  -ms-box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
  -moz-box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
  background: #fff;
  border-radius: 5px;
  padding:0 20px;
  height:750px;
}
.s-three-three {
  position: relative;
  width:34%;
  height:750px;
  overflow: hidden;
}
.s-three-one,.s-three-three{
  box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
  -webkit-box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
  -o-box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
  -ms-box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
  -moz-box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
}
.text {
  font-size: 14px;
}
.box-card .y-list-item:first-child {
  padding-top:0px;
}
.y-list-item {
  padding: 15px 0;
  box-sizing: border-box;
  color:#333;
  border-bottom:1px solid #e7e7e7;
}
.box-card .y-list-item:last-child {
  border-bottom:0px solid #e7e7e7;
}
.y-list-item h3 {
  font-size:14px;
  font-weight: normal;
  margin-bottom:10px;
}
.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
}
.clearfix:after {
  clear: both
}
.box-card {
  width: 100%;
  position: relative;
}
.s-three-one{
  font-size:16px;
 
}
.y-list-border::-webkit-scrollbar {
  display: none; /* 隐藏滚动条 */
}
.y-list-border {
  height:700px;
  overflow-y:scroll;
  overflow-x: hidden;
}
.el-card__header {
  padding:15px 20px;
}
.orange-btn{
  color:#FF6F2E
}
.y-list-txt ul li{
  display: flex;
  font-size:12px;
  margin-bottom:5px;
}
.y-list-txt ul li:last-child{
  margin-bottom:0px;
}
.y-list-txt ul li .left {
  width:60px;
  color:#999;
}
.y-list-txt ul li .right {
  flex:1
}
.y-status {
  font-size:16px;
  font-weight: bold
}
.common-orange-btn{
  padding:6px 8px;
  box-sizing: border-box;
  color:#FF6F2E;
  border:1px solid #FF6F2E;
  border-radius:5px;
  font-size:14px;
}
.common-orange-btn:hover,.common-orange-btn:focus{
  background: #FFF1E5
}
.y-right-border {
  position: relative;
  min-height:110px;
}
.btn-area {
  position: absolute;
  bottom:0px;
  right:0px;
  cursor: pointer;
}
.btn-area-two  {
  position: absolute;
  bottom:0px;
  right:80px;
}
@media screen and (max-width: 1720px) {
 .btn-area-two  {
    position: absolute;
    bottom:40px;
    right:0px;
 }
}
.no-open-list ul{
  padding-top:10px;
}
.no-open-list ul li:first-child {
  padding-top:0px;
}
.no-open-list ul li:last-child {
  padding-bottom:0px;
}
.no-open-list ul li{
  text-align: center;
  padding:20px 0;
 
  border-bottom:1px solid #e7e7e7;
}
.no-open-list ul li:last-child{
  border-bottom:0px solid #e7e7e7;
}
.no-open-list ul li img{
  width:45px;
  height:45px;
}
.no-open-list ul li h3{
  font-size:16px;
  margin-bottom:10px;
  color:#333;
}
.no-open-list ul li p{
  font-size: 14px;
}
.s-t-active {
  width:16%;
}
.s-t-head-box {
  width:100%;
}
.s-t-head-box .right {
  width:60px;
}
.small-head {
  font-size: 14px;
}
.s-three-two-big {
  width:50%;
}
.s-t-center-head {
  height:50px;
  border-bottom:1px solid #e7e7e7;
  width:100%;
  display:flex;
  justify-content: space-between
}
.s-t-center-head .left {
  color:#FF6F2E;
  font-size:14px;
  padding:15px 0;
  box-sizing: border-box
}
.s-t-center-head .left span.title{
  font-size:16px;
  color:#333;
  margin-right:10px;
}
.s-t-center-head .left.first-title{
  overflow: hidden; 
  white-space: nowrap; 
  text-overflow: ellipsis;
  color:#333;
}
.s-t-center-head .right{
  padding:15px 0;
  box-sizing: border-box
}
.s-t-center-head .right select{
  color:#FF6F2E;
  outline: none;
}
.s-t-center-head .right select:focus,.s-t-center-head .right select:active,.s-t-center-head .right select:hover{
  border:0px solid #fff;
}
.s-t-center-main {
  width:100%;
  display:flex;
  height:700px;
}
.s-t-center-main .left,
.s-t-center-main .right{
  overflow-x: hidden;
  overflow-y: scroll;
  height:700px;
  /*隐藏滚动条，当IE下溢出，仍然可以滚动*/
  -ms-overflow-style:none;
  /*火狐下隐藏滚动条*/
  overflow-y:-moz-scrollbars-none;
}
.s-t-center-main .right::-webkit-scrollbar {display:none}
.s-t-center-main .left::-webkit-scrollbar {
  display: none; /* 隐藏滚动条 */
  width:0px;
}

.s-t-center-main .left {
  width:90px;
  border-right:1px solid #e7e7e7;
  text-align:center;
}
.s-t-center-main .right {
  flex:1;
}
.left-menu{
  height: 34px;
  line-height:34px;
  margin:10px 0;
  color:#333;
  font-size:14px;
  cursor:pointer;
}
.left-menu.active {
  width:80px;
  padding:0 10px;
  background: #FF6F2E;
  color:#fff;
  line-height:34px;
  border-radius:5px;
}
.desk-list-main-border {
  padding:15px 0 15px 15px;
}
.desk-list-main {
  position: relative;
  width:110px;
  height:130px;
  padding-top:20px;
  box-sizing: border-box;
  border-radius:5px;
  box-shadow: 0 1px 4px rgba(0, 0, 0, .08);
  border:1px solid rgba(222,222,222,1);
  margin:0 15px 15px 0;
  display: inline-block;
  cursor: pointer;
  z-index:1;
}
.desk-list-main-border .desk-list-main:last-child {
  margin-right:0px;
}
.desk-list-main h4 {
  font-size:16px;
  color:#333;
  font-weight: normal
}
.desk-list-main p {
  color:#666;
  font-size:14px;
  margin-top:10px;
}
.desk-list-main h3 {
  font-size:16px;
  color:#333;
  position:absolute;
  bottom:15px;
  width:100%;
  text-align: center
  
}
.desk-list-main-master {
  position: absolute;
  left:0px;
  top:0px;
  width:100%;
  height:100%;
  background: rgba(251,251,251,.7);
  z-index:15;
  border-radius: 5px;
}
/* 有客状态 */
.bg-orange {
  background: #F16447;
  border:1px solid #F16447
}
.bg-orange h3,.bg-orange h4 {
  color:#fff;
}
.bg-orange p {
  color:#FFF1DF
}
/* 已预订状态 */
.bg-blue{
  background: #1D79DD;
  border:1px solid #1D79DD
}
.bg-blue h3,.bg-blue h4 {
  color:#fff;
}
.bg-blue p {
  color:#C5E1FF
}
/* 下单中状态 */
.bg-yellow{
  background: #FE940F;
  border:1px solid #FE940F
}
.bg-yellow h3,.bg-yellow h4 {
  color:#fff;
}
.bg-yellow p {
  color:#FFF1DF
}
.desk-no-click {
  color:#999;
  font-size:16px;
  padding-top:240px;
}
.currenOption {
  width:64px;
  background:#FF6F2E;
  color: #fff;
  float:right;
  border-radius: 0px  5px  0px  5px;
  padding:5px 0;
}
.desk-info-detail {
  padding:15px 0;
  box-sizing: border-box;
  font-size:14px;
  color:#333;
}
.desk-info-detail-main {
  margin-bottom:10px;
  position: relative;
}
.desk-info-detail-main span {
  color: #999;
}
.desk-info-detail-main a{
  text-decoration: underline;
  color:#FF6F2E;
  margin-left:10px;
  cursor: pointer;
}
.f-option-btn{
  margin-top:180px;
}
.f-option-btn button {
  width:100%;
  border:1px solid #FF6F2E;
  color:#FF6F2E
}
/* 选择菜品样式 */
.select-menu-main {
  display:flex;
  margin-top:15px;
  border-radius: 5px;
  border:1px solid #e7e7e7;
  z-index:10;
}
.select-menu-main .left::-webkit-scrollbar {
  display: none; /* 隐藏滚动条 */
}
.select-menu-main .left::-o-scrollbar {
  display: none; /* 隐藏滚动条 */
}
.select-menu-main .left::-moz-scrollbar {
  display: none; /* 隐藏滚动条 */
}
.select-menu-main .left::-moz-scrollbar {
  display: none; /* 隐藏滚动条 */
}
.select-menu-main .right::-webkit-scrollbar {
  display: none; /* 隐藏滚动条 */
}
.select-menu-main .right::-o-scrollbar {
  display: none; /* 隐藏滚动条 */
}
.select-menu-main .right::-moz-scrollbar {
  display: none; /* 隐藏滚动条 */
}
.select-menu-main .right::-moz-scrollbar {
  display: none; /* 隐藏滚动条 */
}
.select-menu-main .left{
  width:70px;
  background: #F3F3F3;
  border:5px 0 0 5px
}
.select-menu-main .left .active-menu {
  background:#fff;
}
.select-menu-main .left .active-menu :first-child {
  border:5px 0px 0px 0px;
}
.select-menu-main .left .active-menu :last-child {
  border:0px 0px 0px 5px;
}
.select-menu-main .left .leftline {
  position: relative;
  line-height:40px;
  cursor: pointer;
}
.category-nums {
  position: absolute;
  right: 0px;
  top: 5px;
  min-width: 16px;
  height: 16px;
  border-radius: 8px;
  background: linear-gradient(to right, #FD9A29, #FF5127);
  font-size: 10px;
  color: #fff;
  line-height: 16px;
}
.select-menu-main .right {
  flex:1;
  padding:15px;
  box-sizing: border-box
}
.select-menu-main .left,.select-menu-main .right{
  overflow-x: hidden;
  overflow-y:scroll;
  height:340px;
}
.menu-list {
  display: flex;
  padding-bottom:15px;
  box-sizing:border-box;
}
.select-menu-main .right .menu-list:last-child {
   padding-bottom:0px;
}
.menu-list-left,.menu-list-left img{
  width:60px;
  height:60px;
}
.menu-list-center{
  flex:1;
  padding:0 15px;
  color:#333;
  font-size:16px;
}
.select-menu-title,.s-list-count{
  color:#333;
  font-size:16px;
}
.select-menu-title span.numPrice,.s-list-count span.numPrice {
  font-weight: bold;
}
.select-menu-title span.distance,.s-list-count span.distance {
  margin-left:10px;
}
.select-menu-title-count {
  padding-top:10px;
}
.menu-list-right i  {
  font-size:22px;
  color:#FF6F2E;
  cursor: pointer;
}
.menu-list-right span{
  font-size:16px;
  color:#333;
  margin:0 5px;
  position: relative;
  top:-2px;
}
.menu-list-center .goods-name{
  margin-bottom:10px;
}
.d-i-d-nub {
  position: absolute;
  top:0px;
  right:10px;
  width:80px;
  font-size:14px;
  color:#999;
}
.d-i-d-nub .nub{
  color:#333;
}
/* 有客 */
.hasGuest{
  border-top:1px solid #e7e7e7;
  height:550px;
  overflow-x: hidden;
  overflow-y: scroll;
}
.hasGuest::-webkit-scrollbar {
  display: none; /* 隐藏滚动条 */
}
.hasGuestList .title{
  margin:20px 0 10px 0;
  font-size:16px;
  color:#333;
}
.s-list-title {
  color:#999;
  margin-bottom:5px;
  font-size:14px;
  width:100%
}
.s-list-content {
  position: relative;
  border:1px solid #e7e7e7;
  border-radius: 5px;
  padding:20px;
  box-sizing: border-box;
}
.s-list{
  margin-bottom:10px;
  max-height: 382px;
  padding-bottom:10px;
  box-sizing: border-box;
  overflow-x: hidden;
  overflow-y:scroll;
}
.s-list::-webkit-scrollbar {
  display: none; /* 隐藏滚动条 */
}
.s-list-content ul li{
  margin-bottom:10px;
  font-size:14px;
  color:#333;
}
.s-list-count{
  position:absolute;
  top:15px;
  right:10px;
  background-color:#fff;
  z-index:99;
}
.btn-options {
  display: flex;
  margin-top:20px;
}
.btn-options .left{
  flex:1;
  padding-right:10px;
}
.btn-options .right{
  width:140px;
  color:#FF6F2E;
  cursor: pointer;
}
.btn-options .right i{
  margin-left:10px;
}
.s-list-content ul.menu-colse {
  height:20px;
  overflow: hidden;
}
.s-list-content ul.menu-open{
  height:auto;
}
.hasGuest-btn {
  position: absolute;
  bottom:20px;
  width:90%;
  left:20px;
  display: flex;
  justify-content: space-between
}
.hasGuest-btn span{
  cursor: pointer;
}
.no-r-info {
  padding:20px 0;
  box-sizing: border-box;
  border-top:1px solid #e7e7e7;
}
.no-r-info img{
  width:407px;
  height:198px;
}
.no-r-info p{
  color:#999;
  font-size:16px;
}
.no-c-tip {
  padding:20px 0;
  font-size:14px;
  color:#999; 
}
.change-height {
  height:128px;
}
/* 换桌弹框样式 */
.s-t-center-main-model {
  height:500px;
  border:1px solid #e7e7e7;
  border-radius:5px;
}
.s-t-center-main-model .leftModel {
  height:500px;
  background:#ddd;
}
.s-t-center-main-model .leftModel .left-menu{
  height:34px;
  line-height:34px;
   margin:0px;
}
.s-t-center-main-model .leftModel .left-menu:first-child{
  border-radius:5px 0 0 0;
}
.s-t-center-main-model .leftModel .left-menu:last-child{
  border-radius:0 0 0 5px;
}
.s-t-center-main-model .leftModel .left-menu.activeModel{
  width:100%;
  margin:0px;
  background:#fff;
  height:34px;
  line-height:34px;
}
.s-t-center-main-model .rightModel{
  height:500px;
}
.select-checked-icon {
  position: absolute;
  right:10px;
  top:10px;
  width:15px;
  height:15px;
}
.select-checked-icon.hide{
  display: none;
}
.select-checked-icon.show{
  display: block;
}
.select-checked-icon img{
  width:15px;
  height:15px;
}
.a-common-orange{
  color:#FF6F2E;
  border:1px solid #FF6F2E
}
.a-common-orange:hover,.a-common-orange:focus,.a-common-orange:active{
  background: #FF6F2E;
}
.sure-big-btn{
  width:200px;
}
.model-line{
  position: absolute;
  top:60px;
  width:100%;
  left:0;
  height:1px;
  background: #e7e7e7;
  
}
.model-menu-list {
  width:100%;
  display: inline-block;
  /* overflow-x: scroll */
}

.model-menu-list-s{
  width:290px;
  height:auto;
  margin-right:25px;
  padding-top:20px;
  display: inline-block
}
.model-title-change{
  position: absolute;
  top:20px;
  left:20px;
  font-size: 18px;
  color: #303133;
}
.model-menu-list-border {
  border:1px solid #e7e7e7;
  border-radius:5px;
  height:350px;
  position: relative;
}
.model-menu-list-main{
  height:305px;
  overflow-x:hidden;
  overflow-y:scroll;
  padding:15px;
  box-sizing: border-box
}
.model-menu-list-main::-webkit-scrollbar {
  display: none; /* 隐藏滚动条 */
}
.model-menu-list-main::-moz-scrollbar {
  display: none; /* 隐藏滚动条 */
}
.model-menu-list-count{
  position: absolute;
  bottom:0px;
  left:0px;
  width:100%;
  height:45px;
  line-height:45px;
  font-size: 16px;
  color:#333;
  padding:0 20px;
  box-sizing: border-box;
  border-top:1px solid #e7e7e7;
}
.model-menu-list-count .numPrice {
  font-weight: bold;
}
.model-menu-list-content{
  border-bottom:1px solid #e7e7e7;
  margin-top:10px;
}
.model-menu-list-content:last-child{
  border-bottom:0px solid #e7e7e7;
}
.model-menu-list-content .check-box{
  margin-bottom: 10px;
}
.model-menu-list-content-li{
  display:flex;
  margin-bottom:10px;
}
.model-menu-list-content-li  .left{
  flex:1;
}
.model-menu-list-content-li  .right{
  width:80px;
}
.el-checkbox__input.is-checked .el-checkbox__inner, .el-checkbox__input.is-indeterminate .el-checkbox__inner {
    background-color: #FF6F2E;
    border-color: #FF6F2E;
}
.el-checkbox__input.is-checked+.el-checkbox__label {
    color: #333;
}
.el-checkbox__inner：hover{
  border-color: #FF6F2E;
}
.el-checkbox__input.is-focus .el-checkbox__inner{
  border-color: #FF6F2E;
}
.el-checkbox-group{
  font-size: 14px;
}
.model-menu-list-m-b{
  /* display: flex;
  flex-wrap: wrap; */
  padding:10px 0 30px 0;
  box-sizing: border-box
}
.model-menu-list-m-b .model-menu-list-m-b-all{
  display: flex;
  flex-wrap: wrap;
}
.model-menu-list-all-border{
  width:100%;
  max-height:500px;
  overflow-y:scroll;
  display:flex;
  flex-wrap: wrap;
}
.model-menu-list-all-border::-webkit-scrollbar {
  display: none; /* 隐藏滚动条 */
}
.model-menu-list-m-b .first-title{
  margin-top:20px;
}
/* 结账 */
.pay-area {
    width: 100%;
    padding: 0 20px;
    box-sizing: border-box
}
.pay-posi {
    padding:18px 0;
    font-size: 18px;
    /* font-weight: bold; */
    border-bottom:1px solid #EFEFEF;
    display: flex;
    justify-content: space-between;
}
.pay-tb {
    border-collapse: collapse;
    width: 100%;
    height:70px;
}
.pay-tb th {
    text-align: left;
    color: #666;
}
.pay-tb td, .pay-tb th {
    height: 30px;
    /* border: 1px solid violet; */
}
/* 总计应付 */
.pay-momeny {
    padding: 20px 0 23px 0;
    text-align: right;
    color: #666;
    border-top: 1px solid #EFEFEF;
    border-bottom: 1px solid #EFEFEF;
}
.pay-momeny span{
  font-weight: bold
}
 /* 选择支付方式 */
 .pay-select {
    padding: 15px 0;
    border-bottom: 1px solid #EFEFEF;
 }
 .pay-sel-product {
    margin-bottom: 20px;
 }
 .pay-how-much {
    margin: 20px 0 15px 0;
    display: flex;
    line-height:40px;
 }
 .pay-how-much span{
    display: inline-block;
    text-align: right;
    width: 80px;
    margin-right: 20px;
    
    
 }
 .pay-how-much input{
    flex:1;
 }
 .pay-update {
     color: #FF6F2E;
     cursor: pointer;
 }
 /* 确定按钮 */
 .pay-sure-btn {
    margin-top: 20px;
    color: #FF6F2E;
    cursor: pointer;
    margin-left:90px;
 }
 /* 付款信息 */
 .pay-msg {
    margin: 15px 0; 
    color: #666;
 }
 
 /* 总计付款 */
.pay-total {
    border-top: 1px solid #EFEFEF;
    border-bottom: 1px solid #EFEFEF;
    padding: 20px 0;
    text-align: right;
 }
.pay-total span {
    font-size: 20px;
    font-weight: bold;
}
.pay-is-success p{
    width: 200px;
    height: 40px;
    border: 1px solid #FF6F2E;
    padding: 10px 52px;
    border-radius: 5px;
    background-color: #FFF1E5;
    color: #FF6F2E;
    margin: 30px auto;
    cursor: pointer;
}
/* 右侧 */
.pay-right-area {
    position: absolute;
    right:-260px;
    top:0px;
    height:100%;
    background-color:#fff;
    width:260px;
    border-left:1px solid #e7e7e7;

}
.menu-list-right span{
  font-size:16px;
  color:#333;
  margin:0 5px;
  position: relative;
  top:-2px;
}
.menu-list-right i  {
  font-size:22px;
  color:#FF6F2E
}
.pay-dish-list {
    padding: 20px;
    border-bottom: 1px solid #EFEFEF;
}
.pay-dish {
    display: flex;
    margin:9px 0;
}
.pay-dish-name {
    flex: 1;
}
/* 需要支付总金额 */
.pay-total-all {
    width: 100%;
    position: absolute;
    bottom: 0;
    border-top:1px solid #e7e7e7
}
.pay-all {
    padding: 15px;
    border-bottom:1px solid #e7e7e7;
    box-sizing: border-box
}
.pay-all-btn {
    display: flex;
}
.pay-update-status {
    color: #333;
    font-size: 20px;
}
/* 对话框按钮 */
.dialog-btn-area {
  margin: 0 auto;
  margin: 30px 0;
  display: flex;
  justify-content: center;
  padding:0 15px;
  box-sizing: border-box
}
.dialog-btn-area div{
  cursor: pointer
}
.dialog-make-sure {
  display: inline-block;
  border: 1px solid #FF6F2E;
  width: 120px;
  height: 40px;
  color: #FF6F2E;
  background-color: #FFF1E5; 
  border-radius: 5px;
  text-align: center;
  line-height: 40px;
}
.dialog-btn-delete {
  margin-right: 35px;
}
.countDetail{
  position: absolute;
  bottom:15px;
  right:10px;
  width:90%;
  border-top:1px solid #e7e7e7;
  padding-top:10px;
  box-sizing: border-box
}
.order-all-price{
  font-weight: bold;
}
.pay-area-table{
  height:120px;
  overflow-x:hidden;
  overflow-y:scroll;
  padding-bottom:10px;
  box-sizing: border-box
}
.pay-area-table::-webkit-scrollbar {
  display: none; /* 隐藏滚动条 */
}
.pay-select .pay-sure-btn span.paySure{
  cursor: pointer;
}
.pay-dish-list-all{
  height:calc(100% - 177px);
  overflow-x: hidden;
  overflow-y:scroll
}
.pay-dish-list-all .title{
  line-height:30px;
  padding:0 20px 10px 0;
  box-sizing: border-box
}
.pay-dish-list-all .custom-title{
  padding:20px 20px 0 20px
}
.scan-menu-title-second{
  color:#999;
  font-size:14px;
  padding:10px 0
}
.scan-menu-all-border{
  padding-bottom:10px;
  box-sizing: border-box;
  border-bottom:1px solid #e7e7e7;
}
.pay-dish-list .scan-menu-all-border:last-child {
  border-bottom:0px solid #e7e7e7;
}
.pay-dish-list-all::-webkit-scrollbar {
  display: none; /* 隐藏滚动条 */
}
.pay-dish-list-all::-o-scrollbar {
  display: none; /* 隐藏滚动条 */
}
.pay-dish-list-all::-ms-scrollbar {
  display: none; /* 隐藏滚动条 */
}
.pay-dish-list-all::-moz-scrollbar {
  display: none; /* 隐藏滚动条 */
}
.pay-msg-border{
  height:100px;
  overflow-y: scroll;
}
.pay-msg-border::-webkit-scrollbar {
  display: none; /* 隐藏滚动条 */
}
.pay-msg-border::-o-scrollbar {
  display: none; /* 隐藏滚动条 */
}
.pay-msg-border::-moz-scrollbar {
  display: none; /* 隐藏滚动条 */
}
.getMore {
  height: 50px;
  line-height:50px;
  font-size:14px;
  color:#333;
  text-align: center
}
.getMore span{
  cursor: pointer;
}
.warn {
  padding-left: 83px;
  color: #FF1818;
  font-size: 14px;
}
.edit-desk{
  cursor: pointer;
}
</style>
